To begin writing a CSS, follow the same way as you created a HTML file (Click here). In the end, 'Save as.." , '.css' instead of '.html' .
CSS Syntax
- The selector points to the HTML element you want to style.
- The declaration block contains one or more declarations separated by semicolons.
- Each declaration includes a property name and a value, separated by a colon.
Example
myStyle.css
body {
background-color: lightblue;
}
background-color: lightblue;
}
p { color: red; text-align: center; }
Now let's try to use this with HTML file. The text in bold, tells you how to link a CSS file inside HTML.
myHTML.html
<html>
<head>
<link rel="stylesheet" type="text/css" href="myStyle.css">
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph using CSS style.</p>
</body>
</html>
Now, if you want to modify the tag <p>'s color to 'green', then you can directly go to 'myStyle.css' file and change, ' color: green; '. Try it yourself and see the difference.. Can you see the advantages of CSS now?
- Modifying styles is easy. Go to .css file directly and change it there!
- Re-usable: Use the same CSS styles for different HTML file.
- Not very complex to learn.
- Fun to play with styles :)
Once you're familiar with the format, go to this link and start learning about changing background, text, fonts etc. It'll be fun! :)
No comments:
Post a Comment