Friday, November 8, 2013

Tute 3 : Create Dynamic Website : Create Css File

Previous Tutorial :  Create Basic Html File


Last Tutorial we know who to create a basic html file. Now we create a css file and import this index.php page.

Open another new page in notepad++ (file>new or ctrl+N).
Write css code.

----------------------------------------------------------------------------
body{
         background-color:#efefef;
         height:auto;
         width:auto;
         font-size:14px;
         font:times new romans;
         line-height:160%;
}
----------------------------------------------------------------------------

Css code in notepad++
Then save the file. Ctrl+S and make a folder named “css” into tute folder. Then save the file into the css folder named “style.css”.  We used css extension in this file.

After save the file go to the “index.php” file who open in notepad++. Write this line into <head> </head> tag.

--------------------------------------------------------------------
<head>
        <title>Welcome to my tute school</title>
        <link rel="stylesheet" href="css/style.css"/>
</head>
--------------------------------------------------------------------

We write here "css/style.css". "css" is our folder name and "style.css" is our css file name.

Import css file in html file
Then save the file and go to Google chrome and refresh the index.php page. We see our pages background color is changed.
So our Css is worked.

Tute-2 Pic-3



Next tutorial : Write Css Code

8 comments :

  1. Thanks for sharing your informative post. Your post was really helpful and conveys more information to web design and developers.
    web design training in chennaiwebsite designing training

    ReplyDelete
  2. Informative post indeed, I’ve being in and out reading posts regularly and I see alot of engaging people sharing things and majority of the shared information is very valuable and so, here’s my fine read.
    click here to download (link 1)
    click here animated gif
    click here animation
    click here accessibility
    click here arrow gif

    ReplyDelete
  3. This site was... how would I say it? Applicable!! At long last I have discovered something that encouraged me. Good wishes! best interiors

    ReplyDelete