黑色海岸线论坛 - Powered by Discuz! Board

标题: [CSS学习]什么是CSS？ [打印本页]

作者: blueblitz 时间: 2006-11-25 17:56 标题: [CSS学习]什么是CSS？

　　层叠样式表 (Cascading Style Sheet) 是一系列格式规则，它们控制网页内容的外观。使用 CSS 样式可以非常灵活并更好地控制确切的网页外观，从精确的布局定位到特定的字体和样式。　　自1998年5月12日，W3C组织推出了CSS2，使得这项技术在世界范围内得到广泛的支持。CSS2成为了W3C的新标准。同时，W3C CoreStyle和CSS2 Validation Service 以及CSS Test Suite宣布成立。它是一组样式，样式中的属性在HTML元素中依次出现，并显示在浏览器中。样式可以定义在HTML文件的标志（TAG)里，也可以在外部附件文件做为外加文件。此时，一个样式表可以用于多个页面，甚至整个站点，因此具有更好的易用性和扩展性。总的来说，CSS可以完成下列工作：　　1、弥补HTML对网页格式化功能的不足，如段落间距、行距等。　　2、设置字体变化和大小。　　3、设置页面格式的动态更新。　　4、进行排版定位。一、CSS的特点　　1、控制页面中的每一个元素（精确定位）　　2、对HTML语言处理样式的最好补充　　3、把内容和格式处理相分离，减少工作量二、CSS的样式规则　　CSS样式规则由两部分组成：选择器和声明。　　选择器是样式名称（如TR或P）　　声明是用于定义样式元素三、在Dreamweaver中CSS的三种类型　　1、自定义CSS样式（类样式）：使你可以将样式属性设置为任何文本范围或文本块。如： .self{color:#66ff00} 　　强调的一点是在样式名称前必须加“."，并且包含任何字母和数字的组合。如果你没有输入开头的句点，在Dreamweaver中将自动输入。　　2、HTML标签样式：重定义标签的格式。创建或更改标签的CSS样式时，所有用标签设置了格式的文本都立即更新。如： h1{font-family:Arial} 　　3、CSS链接样式：重定义链接有关的格式。有四种如下　　　　A:link 设置正常状态下链接文字的样式　　　　A:active 设置鼠标单击时的链接文字的外观　　　　A:visited 设置访问过的链接外观　　　　A:hover 设置鼠标放置链接文字上文字的效果四、添加CSS样式表的三种方法　　1、直接在标签内定义，主要是在body内实现。例如：

css实例

。不过呢，这种方法使用比较简单、显示直观，无法发挥样式表的优势，因此呢我们是不推荐使用的。　　2、在head里实现的css样式。这种的css一般位于html文件的头部，即与标签内，并且以结束。例如如下代码：　　其中直接是样式的内容，在{ }前面可以写样式的类型和名称。{ }中是样式的属性。这种方法是经常被使用的添加样式表的方法。　　3、在文件外使用（也就是使用链接样式表），就是我们在网页中可以调用我们已经定义好的样式表来实现样式表的应用，它可以定义在html文件内部，也可以单独成为文件。这种方法最适合大型网站的css样式定义。发展概述　　样式表已经诞生了许多年了，但因为在实现方面的缺乏，它的强大性和重要性在很大程度上未被注意到。网页制作者渴望通过改变Web的展示来为自己的网页加入创新的动力，于是开始使用Netscape专有的扩展功能，而不是更强大的样式表。这是很自然的，因为Netscape的专有扩展可以被大部分的网页浏览者所看见，而强大的样式表却很少人能看见。　　今天，越来越多的浏览器实现了样式表，允许改善整个展示同时保留平台独立性的独有特性开阔了网页制作者的视野。样式表的优点变得更明显，虽然不断地为展示效果而加入更多的HTML标记是一个缺点。　　Netscape的BODY属性现在更加广泛地被网页所应用，而且成为了HTML 3.2的标准。可是，BGCOLOR、TEXT和其他属性的灵活程度完全比不上样式表。大部分的背景图象会任由网页不能让那些只有16色显示的人所接受；而对于一些网页256色仍很难接受。使用传统的BODY属性，一个网页制作者必须权衡使用背景图象的好处是否比付出的代价还重；使用样式表的话，网页制作者可以用一些不同的样式表提交一批不同的图象，以便用户可以根据自己的系统可以显示的颜色而选择是“24位样式表”或“8位样式表”。如果网页制作者提供的样式表都不适合用户，用户只要忽略网页制作者的样式就是了。　　样式表可以令到网页制作者的工作更加轻松。当每个水平规则的语句都需要使用

的时候，网页制作者将觉得非常麻烦。使用样式表，只需要指定这样的参数一次，样式就会被整个网站所应用。而且如果网页制作者觉得WIDTH="50%"会更好的话，那么他只需要在一处地方改变这个参数，而不是找遍几百页来更改HTML。不仅仅如此，当一个文件包含了所有的样式信息时，样式表还可以减少下载的时间呢。　　样式表也为他们提供的展示效果的项目给予更多的灵活性。属性，例如颜色、背景、边界、边框和许多的更多都能被所有的元素所应用。仅仅使用HTML和它专有的扩展，必须依赖像BGCOLOR之类的属性，而这些属性只对于少数的一些元素有效。样式表给予应用一个样式到所有的段落、或所有的二级标题、或所有的强调文字很大的灵活性。　　使用样式表，网页制作者可以使用文本缩进属性来缩进文本，而不是借助丑陋的拙集，如

或

带来许多负面的周边效果。边界可以被更改而不用将整页放入到表格中。样式表也可以减少文件的找寻和替换；如果网页制作者决定改变网站中所有段落的缩进，他只需要改变样式表中的一行就行了。　　样式表在Web方面迈开了一个巨大的前进步伐。随着HTML和样式表的内容和展示之间的差距，Web不再需要放弃优秀的思想——平台独立性。网页制作者最终可以改善文档的展示而不会令到用户不能阅读网页。 -------------------------------------------------------------------------------- 已经支持CSS的浏览器　　支持CSS的浏览器数字在继续迅速地增长。扮演重要角色的Netscape Navigator 4.0支持大多数的CSS1和CSS 定位。Microsoft Internet Explorer 3不完全地支持CSS1，而良好的CSS1和CSS 定位被应用到IE4中，伴随着早期的CSS 打印支持。　　长期以来，在UNIX平台上的Emacs-W3和Arena都支持样式表，而且W3C的Amaya浏览器将CSS 支持融合到一个"所见即所得"的编辑器以制作强大的CSS网页。 -------------------------------------------------------------------------------- 超越 CSS1 　　在将来, CSS1的扩展将致力于更好地支持网页打印, 言语样式和凸字输出,定位, 字体和与设备无关的色彩。

欢迎光临黑色海岸线论坛 (http://bbs.thysea.com/)