CSS选择器

来源:互联网 发布:java项目上线流程 编辑:程序博客网 时间:2024/05/22 20:31

CSS的选择器为了更能精确的找个某个元素来设计的。

元素选择器:
div{
color: red;
}

id选择器:
<style>
#d1{
color: red;
}
</style>
 
<div id="d1">Chyson</div>
* id通常都是唯一的.
类选择器:
HTML:
<div class="d1">Chyson</div>
<div>Li</div>
CSS:
<style>
.d1{
color: green;
}
</style>

CSS的其他选择器

属性选择器
选中带有某个属性的元素:
  <style>
   input[type="text"]{
    background-color: yellow;
   }
   
   input[type="password"]{
    background-color: green;
   }
  </style>
层次选择器:
父选择器 子选择器 {  }
  <style>
   #d1 div{
    color: red;
   }
  </style>
伪类选择器:
主要用来描述超链接

<style>
   a:link{
    color:blue;
    font-size: 40px;
   }
   a:visited{
    color: red;
    font-size: 40px;
   }
   a:hover{
    color: green;
    font-size: 100px;
   }
   a:active{
    color: brown;
    font-size: 200px;
   }
  </style>

0 0
原创粉丝点击