样式表
网页设计元素
样式表(style sheet)是关于文件对标题和正文的默认字体、大小、颜色、前页外观、单个部分的排列间隔、行间距、四周页边距、标题间距离等元素的定义。样式表在电子文档开始时,可以通过插入或者链接进行定义。
定义
样式表(style sheet)是关于文件如下元素的定义:
功能
通常,样式表电子文档开始时通过插入或者链接进行定义。这个样式表应用于整个文档。如果需要,整个样式表的特定元素可被应用于文档特定部分的特殊代码而取代。
对于网页,样式表执行相似的功能,允许设计人员跨越网页而保证基本的一致性。通过在文档标题中插入样式规则或者参照单独的样式表可以为整个文档定义样式元素。浏览器可允许用户更改一些或所有样式表属性。
层叠样式表是为填入或取代整个样式表的其它样式表做准备的样式表。它方便了设计人员在需要时更改样式表。
优点
形式和内容分离有一些优点,但只有在主流web浏览器支持CSS的时候才行。
速度快
总的来说,利用样式表的网站的用户体验通常会更快,相比不使用该技术的网站。“整体”来讲第一页可能加载更慢—因为需要传输样式表和内容。后续页面加载速度会变快,因为没有样式信息需要下载——因为CSS文件已经在浏览器的缓存中了。
可维护性
将所有样式保存在一个文件中可以减少维护的时间,减少错误的机会,从而提高表达的一致性。例如,网页上某个级别的标题可能用一种特定的颜色表示,当要修改这些标题的颜色的时候,只需要改变CSS文件中的一个短短的字符串即可。而如果使用以前的方法将样式嵌入在每个页面,需要编辑每个文件,从而繁琐,费时费力,而且容易出错。
可访问性
使用CSS的HTML或XHTML网站更容易调整,以适应不同的浏览器。在浏览器中使用“完全降低”(“degrade gracefully”)CSS的网站不能显示图形内容,如Lynx或那些很老的不支持CSS的浏览器。浏览器忽略它们不能解释的CSS,比如CSS3语句。这使得各种各样的用户代理都能够访问网站的内容,即使他们不能呈现样式表或带有图形能力的设计。例如,一个使用可刷新点字显示输出的浏览器可以完全无视布局信息,并且用户仍然可以访问所有页面内容。
可定制
如果一个页面的布局信息存储在外部,用户可以决定是否完全禁止布局信息,使网站的内容仍然保持一种可读的形式。网站的作者也可以提供多个样式表,可以在没有改变它的任何内容的情况下,彻底改变网站的外观。
大多数现代浏览器还允许用户定义自己的样式表,覆盖原有的布局。例如,允许用户加粗用户访问的每个页面上的每个超链接。
一致性
因为语义文件只包含作者想要传达的含义,文档内容中各种元素的样式是非常一致的。例如,标题、强调文本、列表和数学表达式都使用样式表中定义的样式属性。在创建页面的时候不需要关心样式属性的组合。这些表象细节可以推迟到呈现的时刻。
可移植性
表现的细节可以延迟到展示的时候才考虑,这意味着文档可以很容易被重新编排,在一个完全不同的媒介上展示,只需要为新的表达媒介准备一个新的样式表,同时符合语义文档中元素或结构的词汇。只要通过应用一个新的样式表,精心撰写的web页面文档便可以很容易地被印刷成装订卷,并含有完整的页眉和页脚,页码和生成的目录。
缺点
规范(例如:XHTML、XSL、CSS)和实现这些规范的软件工具只是达到早期成熟阶段。所以试图接受这种内容和形式分离的方法还面临一些世纪性的问题。
没有解析和生成工具导致应用范围小
风格规范仍然相当成熟,软件工具也已经逐渐适应。最主要的web开发工具大多数还是使用内容形式混合的网页编写方式。所以作者和设计者尝试开发基于图形界面的网页编辑工具,但发现很难按照语义web方法开发基于GUI的工具。除了GUI工具,广义样式表共享库可能会有助于这些方法的落地。
最新修订时间:2022-08-25 12:31
目录
概述
定义
功能
参考资料