CSS Html Template Tutorial
| What is CSS? CSS is Cascading Styles Sheets. In plain English, it is a way to style HTML. |
|
Inline CSS Styles: Inline CSS is pluged straight into HTML codes. It looks something like this. <p style= “color: blue”>baby blue color</P> The paragraph that is under this tag will be in blue. In general, inline CSS styles are not the best designed, because a good HTML codes should be left alone.
Internal CSS Styles: Internal CSS Styles are also known as Embedded Styles. It should look something like this.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
.style1 {color: #FF0000}
-->
</style>
</head>
<body>
<span class="style1">This is my firt website.</span>
</body>
</html>
All fonts that use style 1 will be in red.
External CSS Styles: Internal CSS Styles can make HTML unnecessary lengthy. Imagine you have 30 different font styles. Therefore, you should move code for style sheet else where. Here is an example of the code.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>CSS Example</title>
<link rel="stylesheet" type="text/css" href="web.css" /> ...
Colors : There are over 16,77,216 possible colors with CSS styles. The colors is calculated in Hexadecimal, and hash character is prefixed. For instance, if the red color is #ff0000 . If you are not familiar with Hexadecimal number, you can always use the 17 predefine colors: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, orange, purple, red, silver, teal, white, and yellow. Here is how you can apply color in CSS
h1 { color: yellow; background-color: blue; }
|
