Nov
21

CSS Basics

Author admin    Category Web Development     Tags

You must learn CSS if you want to make websites!

1. Find the folder you made index.html in

2. Make a new text document and save it as style.css

3. Open index.html in your text editor,
3.1 Go between the <head></head> tags and add:

<link rel="stylesheet" type="text/css" href="style.css" />

4. Now the style sheet file is linked to your index.html page!

Go ahead and close your index.html file and open your style.css file.

Standard Formatting

Here is a good way to standardize your CSS document:

* {margin: 0; padding: 0}body { background-color: #fff; color: #000; font-family: 'Trebuchet MS', sans-serif; font-size: 15px;}

The above will apply everything to entire document.

Change all the <p> tags

The beauty of CSS is that you can change one line and it affects every html page of yours, here is how you do the tag:

p { padding: 5px; border: 1px solid red;}

Elements, Classes, and ID's

In CSS you apply rules to one of the 3 of these, Classes and ID's are things you set,

body, p, em = Elements, any HTML tag.

#name = ID, a pound sign with any name you want to give it

.name = Class, a period with any name you want to give it.

To apply an ID or class to an HTML element you would do it this way:

<a class="name" href="test.html">Test</a> -- And all settings for .name in CSS will go to this Anchor.

<a id="name" href="text.html">Test</a> -- Same for this, but you only want to use ID's for things that are used once, such as Layout pieces.

Post comment

Recent Posts

Archives

Your Ad Here