网页学习基础知识之认识了解CSS样式表

80酷酷网    80kuku.com

  css|网页|样式表

需要具备的基础知识

在继续学习之前,你需要对下面的知识有基本的了解:

  • HTML
  • XHTML

如果你希望首先学习这些项目,请在本站访问相关教程。

CSS 概述
  • CSS指层叠样式表(Cascading Style Sheets),层叠的意思是:多重样式定义被层叠为一。
  • CSS是标准的布局语言,用来控制元素的尺寸、颜色、排版。
  • CSS非常精确,功能强大,易于编写。
  • CSS由W3C发明,用来取代基于表格的布局、框架以及其他非标准的表现方法。
  • 样式(style)定义如何显示HTML元素;样式通常存储于样式表中;外部样式表存储于CSS文件中。
  • 外部样式表(External Style Sheets)可以极大地提升你的工作效率,并且可以极大地节约服务器的带宽。
  • 纯CSS的布局与XHTML的结合,可使表现与结构分离,并使站点更易维护,易用性更好。

CSS演示

通过使用CSS,HTML文档将以不同的输出样式被显示出来。

样式解决了一个普遍的问题

HTML标签原本被设计为用来定义文档内容。通过使用<h1>, <p>, <table>这样的标签,HTML当初被指望用来表达“这是标题”、“这是段落”、“这是表格”之类的信息。而文档的布局被期望由浏览器来完成,而不使用任何的格式化标签。

由于两种主要的浏览器(Netscape和Internet Explorer)不断地将新的HTML标签和属性(比如字体标签和颜色属性)添加到HTML规范之中,因此创建那些文档内容清晰地独立于文档表现层的站点变得越来越困难。

为了解决这个问题,万维网联盟(W3C),这个非营利的标准化联盟,肩负起了HTML标准化的使命,并在HTML 4.0之外创造出STYLES(样式)。

所有的主流浏览器均支持层叠样式表。

样式表极大地提高了工作效率

样式表定义HTML元素如何被显示,诸如HTML 3.2的样式中的字体标签和颜色属性通常被保存在外部的.css文件中。通过仅仅编辑一个简单的CSS文档,外部样式表使你有能力同时改变站点中所有页面布局的外观。

由于允许同时控制多重页面的样式和布局,CSS可以称得上WEB设计领域的一个突破。作为网站开发者,你可以为每个HTML元素定义样式,并将之应用于你希望的任意多的页面。为了进行全局变换,只需简单地改变样式,然后网站中的所有元素均会被自动地升级。

多重样式将层叠为一个

样式表允许样式信息以多种方式被规定。样式可以被规定于单个的HTML元素中,在HTML页的头元素中,或在一个外部的CSS文件中。甚至多重的外部样式表可以在一个单一的HTML文档内部被引用。

层叠次序

当同一个HTML元素被不止一个样式所定义时,哪个样式会被使用呢?

一般而言,所有的样式会根据下面的规则层叠于一个新的虚拟样式表中,其中数字4拥有最高的优先权。

  1. 浏览器缺省设置
  2. 外部样式表
  3. 内部样式表(位于<head>标签内部)
  4. 内联样式(在HTML元素内部)

因此,内联样式(在HTML元素内部)拥有最高的优先权,这意味着它将优先于以下的样式声明:<head>标签中的样式声明,外部样式表中的样式声明,或者浏览器中的样式声明(缺省值)。



分享到
  • 微信分享
  • 新浪微博
  • QQ好友
  • QQ空间
点击: