10. 层叠样式表CSS概述

10.1 DHTML和CSS概念

一个好的Web页面，不但有丰富的内容，同事也需要有精美和“引人注目”的显示效果。DHTML就是具有动态属性和动态显示效果的HTML，而CSS则规定了各种显示风格样式的名称和设置值的规则。

10.2 CSS的基本类型

样式规则定义的第一部分成为selector（选择器），它定义了HTML文件中受该样式规则影响的HTML元素。selector包括有HTML selector、class selector、ID selector这3中基本类型，以及在这3类基本类型基础之上的其他selector。

以HTML标记形式实现的HTML selector

HTML selector就是通过HTML标记来实现的样式选择器，例如

、

、等。HTML selector一般在HTML文档的区标记对之间进行定义。

如果在CSS中将某一个HTML标记定义成了selector，那么在CSS所有应用的网页中，所有这个HTML标记都按照相应的样式规则定义语句显示。

HTML脚本在浏览器中的执行方式是解释执行方式，解释执行方式是一种顺序执行方式，因此一旦在前面定义了CSS的样式，后面脚本中就会把这种样式作用于特定的Web元素。比如在前面定义了CSS的样式：

那么后面脚本中所有的

标记对之间的文本颜色都将会是绿色。

例子：

HTML选择器实例

生命在于运动

以class属性实现的Class selector

这里类的概念是各HTML标记所通用的属性class。比如要在网页中对段落分类，只需要为各个段落标记

的class属性指定不同值即可。这种选择器的格式定义类似于HTML的selector。

这里所说的类不同于面向对象编程语言中的类，它仅仅是HTML标记的class属性。

例子：

HTML类选择器实例

生命在于运动

注：这里浏览器不支持“类”的使用。

以ID属性实现的ID selector

例子：

HTML类选择器实例

生命在于运动

10.3 CSS的基本用法

正文中使用

例子：

内联样式表实例

隶书;

生命在于运动

在之间

例子：

内联样式表实例

生命在于运动

使用单独的文件存放的外部样式表

存放于单独的.css文件，并用标记设置使用样式表而定规则的方式。

例子：

欢迎使用超级系统维护软件

用户名
密码
自动登录
	进入" class="botton">

2.css

body,table

{

font:12px Tahoma;

margin:20px;

}

h2{

font:bolder 24px Tahoma;

color:darkred;

}

.table{

border:1px outset lightgrey;

padding:20px;

background:lightyellow;

width:300px;

}

.button{padding:2px 10px 2px 10px;

border:1 out1set white;

background:darkblue;

color:white;

font:bolder 11px Tahoma

}

#footer{

font:10px Tahoma;

margin:30px 10px 10px 10px;

text-align:right;

}

转载于:https://www.cnblogs.com/free-1122/p/9882345.html

本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至 162202241@qq.com 举报，一经查实，本站将立刻删除。

1313e

web-10. 层叠样式表CSS概述

10. 层叠样式表CSS概述

生命在于运动