[工学]CSS教程123.ppt

visibility 的属性值 visibility 属性设置元素是否可见或不可见。即使不可 见的元素也会占据页面上的空间。如果不可见元素不占据页面空间则用display来控制。 Visible 元素是可见的。 Hidden 元素是不可见的。 CSS 定位(Positioning) Bottom 定义了定位元素下外边距边界与其包含块下边界之间的偏移。 clip 设置元素的形状。元素被剪入这个形状之中，然后显示出来。 left 定义了定位元素左外边距边界与其包含块左边界之间的偏移。 Overflow 设置当元素的内容溢出其区域时发生的事情。 Position 把元素放置到一个静态的、相对的、绝对的、或固定的位置 中。 Right 定义了定位元素右外边距边界与其包含块右边界之间的偏移。 Top 定义了一个定位元素的上外边距边界与其包含块上边界之间的 偏移。 vertical-align 设置元素的垂直对齐方式。 z-index 设置元素的堆叠顺序 。 例题 css-18.html、css-19.html、 css-20.html CSS 伪类(Pseudo-classes) CSS 伪类用于向某些选择器添加特殊的效果。 伪类的语法： selector:pseudo-class {property: value} a:link {color: #FF0000} a:visited {color: #00FF00} a:hover {color: #FF00FF} a:active {color: #0000FF} 提示：在 CSS 定义中，a:hover 必须被置于 a:link 和  a:visited 之后，才是有效的。a:active 必须被置 于 a:hover 之后，才是有效的。 例题 css-21.html CSS 伪元素(Pseudo-elements) CSS 伪元素用于将特殊的效果添加到某些选择器。伪元素的语法： 选择器 : 伪元素 { 属性: 值 } :first-letter 将特殊的样式添加到文本的首字母 :first-line 将特殊的样式添加到文本的首行 例题 css-22.html CSS层叠样式表 CSS层叠样式表 CSS的全称是Cascading Style Sheet，中文翻译为“层 叠样式表”。实用CSS可以改变HTML的基本特性，从而控 制传统网页上的元素，诸如精确的空白、段落缩进、文本 的外观和链接的状态等等。这样，你就可以实现对网页元 素的格式控制。 CSS不仅允许你指定单个网页的外观， 还可以被用来为网站提供一致的界面。 CSS样式通常保存在外部的 .css 文件中。通过仅仅 编辑一个简单的 CSS 文档，外部样式表使你有能力同时 改变站点中所有页面的布局和外观。这样，创建的文档 内容和文档的显示外观就有着明显的相互独立。 当然，CSS样式也可以以style标签的形式写在网页 文件的head标签中，或是直接将CSS语句书写在某个元 素标签的属性部分。 当同一个 HTML 元素被不止一个样式定义时，会使用 哪个样式呢？ 一般而言，所有的样式会根据下面的规则层叠于一个 新的虚拟样式表中，它们产生作用的优先级别为如下顺 序： 内联样式（在 HTML 元素内部） 内部样式表（位于 head 标签内部） 外部样式表（以CSS文件独立存在） 例题 css-1.html CSS 语法 CSS 语法由三部分构成：选择器、属性和值： selector {property: value} 选择器 (selector) 通常是你希望定义的HTML元素或标签，属性 (property)是你希望改变的属性，并且每个属性都有一个值。属性和值被冒号分开，并由花括号包围，这样就组成了一个完整的样式声明（declaration）,例如： body {color: blue} 如果值为若干单词，则要给值加引号： p {font-family: sans serif;} 如果要定义不止一个声明，则需要用分号将每个声明分开。最后一条规则是不需要加分号的，但是一般在每条声