CSS|learning-a.com

CSS is the acronym for cascading style sheet. You can use CSS to decorate your web page appearance. Of course you may directly specify how wide a div is in a html page, like <div id="firstDiv" width="100px">. But if you need the same appearance for div with id=”firstDiv” in hundreds of pages, every change for the appearance of “firstDiv” in these hundred of pages would be a nightmare. A good solution for this headache repetitive task is using external css.

There are three ways to use CSS.

1 External CSS

External style sheet can save you lots of work as we mentioned above. In the example below, you put css in a file called style.css. In the tag <link>, href=”" specifies where to find the css file; rel and type tell browser the external file is a css file.


<html>
<head>
<link rel="stylesheet" type="text/css" href="learning-a.com/style.css" />
</head>
</html>

2 Internal CSS

You may put a short css snippet in the page head to control the appearance of the page. In the example below, #testcss{....} controls the appearance of div with id=”testcss”.

<html>
<head>
<style>
#testcss {
	width:100px;
	height:50px;
	background:green;
}
</style>
</head>
<body>
<div id="testcss">Test css</div>

</body>
</html>

3 Inline CSS

You may also put css in a html tag like below, style is put in the tag <div>.

<html>
<head>
</head>
<body>
	<div style="width:100px; height:50px; background:green;">Test css</div>
</body>
</html>