css 标签选择器和类选择器

node2:/var/www/html#cat a18.html 
<link rel="stylesheet" type="text/css" href="a18.css">
<div class="one" id="one">
   id为one,class为one的div
   <div class="mini">class为mini</div>
</div>

<div class="one" id="two" title="test">
id为two,class为one,title为test的div.
<div class="mini" title="other">class为mini,title为other</div>
<div class="mini" title="test">class为mini,title为test</div>
</div>

<div class="one">
<div class="mini">class为mini</div>
<div class="mini">class为mini</div>
<div class="mini">class为mini</div>
<div class="mini"></div>
</div>

<div class="one">
<div class="mini">class为mini</div>
<div class="mini">class为mini</div>
<div class="mini">class为mini</div>
<div class="mini" titile="tesst">class为mini,title为tesst</div>
</div>

<div style="display:none;" class="none">style的display为"none"的div</div>

 <div class="hide">class为"hide"的div</div>
 <div>
 包含input的type为"hidden"的div<input type="hidden" size="8"/>
 </div>
 <span id="mover">正在执行动画的span元素.</span>
node2:/var/www/html#


node2:/var/www/html#cat a18.css 
<!--标签选择器-->
div,span,p {
  width:140px;
  height:140px;
  margin:5px;
  background:#aaa;
  border:#000 1px solid;
  float:left;
  font-size:17px;
   font-family:Verdanna;
  }
<!--类选择器-->
  div.mini {
    width:55px;
	height:55px;
	background-color:#aaa;
	font-size:12px;
}
  div.hide{
    display:none;
}

猜你喜欢

转载自blog.csdn.net/zhaoyangjian724/article/details/88526663