• Archives

  • Archive for the ‘CSS’ Category

    An easy way so that you don’t have to learn css colors

    Thursday, May 15th, 2008

    Do you think you need to learn all those colors codes given below ?

    NO !!! You need not learn those colors for applying them

    Here is a SIMPLE FAST AND STUPID trick

    Just open adobe photoshop click on the color chooser

    Select the color and check the highlighted portion copy the code in it and put it like

    #0090FF

    In your code

    Thanks

    krates

    Outlining the text

    Monday, March 31st, 2008

    Sometimes you need to outline a text

    we can do it easily by using css border command

    Syntax:

    <html>
    <head>
    <style type=”text/css”>
    p
    {
    border: red solid thin;
    background-color:yellow;

    }
    </style>
    </head>
    <body>

    <center><p>Some text</p></center>

    </body>
    </html>

    The this code will produce below like elements

    Thanks

    krates

    set all the margin properties in one declaration

    Sunday, March 9th, 2008

    This tutorial will teach you how to set all margin properties in one declaration

     Syntax

    p.class{margin: 2cm 4cm 3cm 4cm}

    Using 

    <html>
    <head>
    <style type=”text/css”>
    p.margin {margin: 2px 4px 3px 4px}
    </style>
    </head>

    <body>
    <p class=”margin”>Checking the margin properties</p>
    </body>

    </html>

    Thanks

    krates

    Specify the white space between words

    Friday, February 8th, 2008

    This tutorial is going to teach you how to specify the white space between the words sometimes it becomes important to do or else you can learn it for the sake of learning.

    Html file

    <html>

    <head>

    <link rel=”stylesheet” href=”style.css” />

    </head>

    <body>

    <p>This is a sample text of which white spaces will be controlled by css.</p>

    </body>

    </html>

     Style

    p
    {
    word-spacing: 25px
    }

    Now if you rum the html file see the word spacing it will be more than it’s usual

    Thanks

    krates

    Having a fixed image

    Friday, January 11th, 2008

    Sometimes you want your image to be fixed in a certain which not be scrolled down with the rest of the page:

    This css code will help you do that

    .something{

    background-image: url(‘imagename.gif’);
    background-repeat: no-repeat;
    background-attachment: fixed
    }

    See the properties first we give the url of the image to be shown using background image property

    then we add a no-repeat to stop repeating of image

    And theen we add a background attachment that fixes the image like a glue

    Thanks

    krates