Showing posts with label CSS. Show all posts
Showing posts with label CSS. Show all posts

Saturday, 1 June 2013

0

Set the color of an Outline and Set The Width of an Outline

  • Saturday, 1 June 2013
  • able
  • <html>
    <head>
    <style type="text/css">
    p
    {
    border: red solid thin;
    outline-style: solid;
    outline-color: #00ff00
    }
    </style>
    </head>
    <body>

    <p>Some text.</p>

    </body>
    </html>
    (does not work in IE)

    Set the width of an outline
    <html>
    <head>
    <style type="text/css">
    p.one
    {
    border: red solid thin;
    outline-style: solid;
    outline-width: thick
    }
    p.two
    {
    border: red solid thin;
    outline-style: solid;
    outline-width: 2px
    }
    </style>
    </head>
    <body>
    Read More
    0

    Set the style of the four borders In CSS

  • able
  • <html>
    <head>

    <style type="text/css">

    p.dotted {border-style: dotted}
    p.dashed {border-style: dashed}
    p.solid {border-style: solid}
    p.double {border-style: double}
    p.groove {border-style: groove}
    p.ridge {border-style: ridge}
    p.inset {border-style: inset}
    p.outset {border-style: outset}
    </style>
    </head>

    <body>
    <p class="dotted">A dotted border</p>

    <p class="dashed">A dashed border</p>

    <p class="solid">A solid border</p>

    <p class="double">A double border</p>

    <p class="groove">A groove border</p>

    <p class="ridge">A ridge border</p>

    <p class="inset">An inset border</p>

    <p class="outset">An outset border</p>
    </body>

    </html>


    Set the style of the bottom border
    <html>
    <head>
    <style type="text/css">
    p.dotted {border-bottom-style: dotted}
    p.dashed {border-bottom-style: dashed}
    p.solid {border-bottom-style: solid}
    p.double {border-bottom-style: double}
    p.groove {border-bottom-style: groove}
    p.ridge {border-bottom-style: ridge}
    p.inset {border-bottom-style: inset}
    p.outset {border-bottom-style: outset}

    </style>

    </head>

    <body>
    <p class="dotted">A dotted border</p>

    <p class="dashed">A dashed border</p>

    <p class="solid">A solid border</p>

    <p class="double">A double border</p>

    <p class="groove">A groove border</p>

    <p class="ridge">A ridge border</p>

    <p class="inset">An inset border</p>

    <p class="outset">An outset border</p>
    </body>
    </html>
    Read More

    Friday, 31 May 2013

    0

    Diffrernt text Decoration In CSS

  • Friday, 31 May 2013
  • able
  • <html>
    <head>
    <style type="text/css">
    h1 {text-decoration: overline}
    h2 {text-decoration: line-through}
    h3 {text-decoration: underline}
    h4 {text-decoration: blink}
    a {text-decoration: none}
    </style>
    </head>

    <body>
    <h1>This is header 1</h1>
    <h2>This is header 2</h2>
    <h3>This is header 3</h3>
    <h4>This is header 4</h4>
    <p><a href="../default.asp.htm">This is a link</a></p>
    </body>

    </html>
    Read More
    0

    In CSS How To Repeat a Background Image Only Vertically and Horizontally

  • able

  • How to repeat a background image only vertically
    <html>
    <head>

    <style type="text/css">
    body
    {
    background-image:
    url('bgdesert.jpg');
    background-repeat: repeat-y
    }
    </style>

    </head>

    <body>
    </body>
    </html>

     How to repeat a background image only horizontally

    <html>
    <head>

    <style type="text/css">
    body
    {
    background-image:
    url('bgdesert.jpg');
    background-repeat: repeat-x
    }
    </style>

    </head>

    <body>
    </body>
    </html>
    Read More

    Download

    Subscribe