Stylesheet）。
在主页制作时采用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。
只要对相应的代码做一些简单的修改，就可以改变同一页面的不同部分，或者页数不同的网页的外观和格式。
它的作用可以达到：
（1）在几乎所有的浏览器上都可以使用。
（2）以前一些非得通过图片转换实现的功能，现在只要用CSS就可以轻松实现，从而更快地下载页面。
（3）使页面的字体变得更漂亮，更容易编排，使页面真正赏心悦目。
（4）你可以轻松地控制页面的布局
。
（5）你可以将许多网页的风格格式同时更新，不用再一页一页地更新了。你可以将站点上所有的网页风格都使用一个CSS文件进行控制，只要修改这个CSS文件中相应的行，那么整个站点的所有页面都会随之发生变动。
CSS是Cascading Style Sheets（层叠样式表单）的简称。CSS就是一种叫做样式表（stylesheet）的技术。也有的人称之为“层叠样式表”（Cascading Stylesheet）。CSS主要用来设计网页的样式，美化网页；它不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。
CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。
在主页制作时采用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。
只要对相应的代码做一些简单的修改，就可以改变同一页面的不同部分，或者页数不同的网页的外观和格式。
在css进入前端语言之前，很多一部分人都把css当做一种前端语言，发展至今，css不仅能装饰网页，也可以配合各种脚本对于网页进行格式化。
工作原理
CSS是一种定义样式结构如字体、颜色、位置等的语言，被用于描述网页上的信息格式化和现实的方式。CSS样式可以直接存储于HTML网页或者单独的样式单文件。无论哪一种方式，样式单包含将样式应用到指定类型的元素的规则。外部使用时，样式单规则被放置在一个带有文件扩展名_css的外部样式单文档中。
样式规则是可应用于网页中元素，如文本段落或链接的格式化指令。样式规则由一个或多个样式属性及其值组成。内部样式单直接放在网页中，外部样式单保存在独立的文档中，网页通过一个特殊标签链接外部样式单。
名称CSS中的“层叠（cascading）”表示样式单规则应用于HTML文档元素的方式。具体地说，CSS样式单中的样式形成一个层次结构，更具体的样式覆盖通用样式。样式规则的优先级由CSS根据这个层次结构决定，从而实现级联效果。
<script language="javascript">// JavaScript DocumentstartList = function() {if (document.all&&document.getElementById) {navRoot = document.getElementById("nav")for (i=0i<navRoot.childNodes.lengthi++) {node = navRoot.childNodes[i]if (node.nodeName=="LI") {node.onmouseover=function() {this.className+=" over"} node.onmouseout=function() { this.className=this.className.replace(" over", "")} } } }}window.onload=startList</script><style type=text/css><!--body { font: normal 11px verdana}ul { margin: 0padding: 0list-style: nonewidth: 150px/* Width of Menu Items */ border-bottom: 1px solid #ccc} ul li { position: relative} li ul { position: absoluteleft: 149px/* Set 1px less than menu width */ top: 0display: none}/* Styles for Menu Items */ul li a { display: blocktext-decoration: nonecolor: #777background: #fff/* IE6 Bug */ padding: 5pxborder: 1px solid #ccc/* IE6 Bug */ border-bottom: 0} /* Holly Hack. IE Requirement */* ul li { float: leftheight: 1%}* ul li a { height: 1%}/* End */li:hover ul, li.over ul { display: block} /* The magic */--></style><ul id="nav"><li><a #">Home</a></li><li><a #">About</a><ul><li><a #">History</a></li><li><a #">Team</a></li><li><a #">Offices</a></li></ul></li><li><a #">Services</a><ul><li><a #">Web Design</a></li><li><a #">Internet Marketing</a></li><li><a #">Hosting</a></li><li><a #">Domain Names</a></li><li><a #">Broadband</a></li></ul></li><li><a #">Contact Us</a><ul><li><a #">United Kingdom</a></li><li><a #">France</a></li><li><a #">USA</a></li><li><a #">Australia</a></li></ul></li></ul> lishixinzhi/Article/program/Java/Javascript/201311/25433
