有关css选则符的解析

发布时间:2020-07-26编辑:脚本学堂
下面是关于css选择符的解析,包括class选择符、类选择符等,需要的朋友参考一下。

/*标题的样式*/
 

复制代码 代码示例:
.th1{
border-width:1px;
background-color: #3C7DE5;
color: #FFFFFF;
}
 

/*按钮样式,针对普通按钮,要是提交按钮会出现黑边框*/
 

复制代码 代码示例:
.btn{
border: 1px solid #999999; height: 20px; background-color:#DFDFDF
}
img{ border:none; }
caption{ font-size:10pt; font-weight:blod; }
.bannerinfo{ color: #AA0000; font-weight:blod; }
.swtd1 { line-height: 12px; text-align: center; vertical-align: middle; }
table{ border-collapse: collapse; }
.swtd2 { background-color:#D1D1D1; line-height: 12px; text-align: center; vertical-align: middle; }
 
/*作用于class=tab1的table(其它元素尽管class=tab1,但没效果)的th(对table本身不起作用),和class=tab1的table的td元素*/
复制代码 代码示例:
table.tab1 th,table.tab1 td{
font-size: 12px; border:1px solid #999999; height:24px;
}
 
/*作用于class=tab2中的元素以及包含其中的th,td元素,注意每个作用范围要用逗号隔开*/
复制代码 代码示例:
.tab2,.tab2 th,.tab2 td{
font-size: 12px; border: 0px none #FFFFFF; height:24px;
}
 
/*color: #D4D0C8该色彩适中,为浅色,所以适合做滚动条或不太显眼的背景色
*/
div p作用于包含在div里的所有p元素,不管是父子关系,还是祖孙关系
div>p只作用于div中的子元素p包含的语法优先于子对象