CSS规则：选择器，一个或者多个声明
h1 {color:red; font-size:14px;}
| | | | |
选择器 {属性 : 值; 属性 : 值;}
选择器的分组 h1,h2,h3,h4,h5h6{
color:green;}
摆脱继承 body{
font-family:Verdana,sans-serif;}
p{
font-family:Times,"Times New Roman",serif;}
派生选择器 li strong{
font-style:italic;
font-weight:normal;}
id 选择器(一次) #red{color:red;}
#green {color:green;}
<p id="red">这个段落是红的</p>
<p id="green">这个段落是绿的</p>
id选择器和派生选择器(可多次) #sidebar p{font-style:italic;text-align:right;margin-top:0.5em;}
#sidebar p{font-style:italic;text-align:ritht;margin-top:0.5em;}
#sidebar h2{font-size:1em;font-weight:normal;font-style:italic;margin:0;line:height:1.5;text-align:right;}
class（类）选择器 .center{text:align:center}
<h1 class="center">这段将居中</h1>
<p class="center">这段也将居中</p>
和id一样,class也可用作派生选择器: .fancy td{color:#f60;background:#666}
属性选择器 [title]{color:red;}
属性和值选择器 [title=w3cshool]{border:5px solid blue}
属性和值选择器 多个值 [title~=hello]{color:red;}
input[type="text"]{width:350px;display:block;margin-bottom:0px;background-color:yellow;font-family:Verdana,Arial;}
input[type=["button"]{width:111px;margin-left:33px;display:block;font-family:Verdana,Arial;}
外部样式 <head><link rel="stylesheet"type="text/css"href="mystyle.css"/></head>
内容 hr{color:scenma;}
p{margin-left:20px;}
内部样式表<head>
<style type="text/css">
hr{color:scenma;}
p{margin-left:20px;}
</style></head>
内联样式<p style="color:sienma;margin-left:22px;}
多重样式 外部样式表针对h3选择器 h3{
color:red;text-align:left;font-size:8pt; }
内部样式表对h3选择器的两个属性 h3{
text-align:right;font-size:20pt}
同时拥有两种样式表后 h3的样式 h3{color:red; text-align:right;font-size:20pt}
6178
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
