CSS——用于设计网页的排版
建立CSS样式表
CSS样式表由选择器与样式规则组成。
所谓选择器,可以是HTML中的标记(最常用),class属性,或者id属性,例如:
h1{color:red}
一个选择器中可以设置多种不同的规则,中间用分号分隔。范例:
<style>
h3{font-size:32px;
line-height:16px;
border:1px #00FF33 solid;}
</style>
应用CSS样式表
三种方式:
1 行内声明,即直接将CSS样式写在HTML标记中。范例:
<body>
<h1 style="font-family:Broadway BT; border:1px #336679 solid;">人世苦短又有几人看破,大梦一场,不过是时间蹉跎,预知后事如何,且听下回分说</h1>
<h1>人世苦短又有几人看破,大梦一场,不过是时间蹉跎,预知后事如何,且听下回分说</p>
</h1>
</body>
2 内嵌声明,在HTML中以< style></ style>标记进行声明,将此样式表放在HTML标头区域。
3 链接外部样式文件,外部文件格式与内嵌声明格式相同,只需省略< style></ style>标记。
CSS选择器
分5种:
1 标记名称——使用HTML标记当作选择器,此后HTML相同标记都应用此一样式,例如;
<div>{font-size:16px; color:#00FFCC;}
2 全局选择器(*)
使用" * "字符来选择所有的标记,例如:
*{font-size:16px; color:#33CCCC;}
3 class选择器,利用此属性可以使样式应用到不同的标记中。
声明格式例如:
.car{font-size:36px;color:#99CCFF;font-weight:bold;}
class选择器中名字自取。如果希望仅在某一种标记上应用class选择器的样式,可以在class选择器之前加上标记名称,范例:
<style type="text/css">
font.txt{
font-size:32px;
line-height:16px;
border:1px #00FF33 solid;}
</style>
</head>
<body>
<font class="txt">The end of the Funking World</font>
</body>
4 id选择器
声明格式:
#id属性名{样式规则;}
范例:
<style type="text/css">
#font_txt{
font-size:32px;
color:#FF6600;
font-family:"宋体";
line-height:16px;
border:1px #00FF33 solid;}
</style>
</head>
<body>
<font id="font_txt">The end of the Funking World</font>
</body>
CSS样式表的注释是在文字前后加上/*...... */
id名称在同一份HTML文件中是唯一的,class可以重复。