The selector specifies the tag that CSS is to act on, and the name of that tag is the selector. Meaning: Which container to choose (the label itself is the container that encapsulates the data).

##

@CHARSET "UTF-8";
          /*css中選擇器有很多種，第一種就是最基本的元素選擇器（又稱類型選擇器）。
           *文檔的元素就是最基本的選擇器。
           *如果設(shè)置 HTML 的樣式，選擇器通常將是某個(gè) HTML 元素，
           *   比如 p、h1、em、a，甚至可以是 html 本身：
           */
         h2{
           color:blue;
         }
         
         /*第二種選擇器： 類樣式選擇器 */
          /*對(duì)所有 "aa"類樣式進(jìn)行設(shè)置
	     .aa{
	       background-color: #00FF00;
	     }
	     */
	     
	     /*僅僅是對(duì)p中的"aa"類樣式進(jìn)行設(shè)置*/
	     p.aa{
	       background-color: #00FF00;
	     }
	     .bb{
	        background-color: #004444; 
	     }
	     
	     /*第三種選擇器 id選擇器 
	      *ID 選擇器允許以一種獨(dú)立于文檔元素的方式來(lái)指定樣式。
          *在某些方面，ID 選擇器類似于類選擇器，不過(guò)也有一些重要差別。
	      */
	     
	     /*id選擇器*/
	     #d1{
	        background-color: #0000FF;
	     }
	     
	     
	     /*其他選擇器*/
	     
	    /*1.關(guān)聯(lián)選擇器*/
	      p span{/*選擇p標(biāo)簽容器中的span*/
	        font-size:20pt;
	      }
	      
	    /*2.組合選擇器*/
	    p span，.c,#d1{
	      color:red;
	    }
	    
	    /*3.偽元素選擇器*/
	   /*CSS 偽元素用于向某些選擇器設(shè)置特殊效果。*/
	    span:HOVER {
	          background-color:#FFFF00;
	          font-size: 20pt;
	          cursor: pointer;
		   }
		   
	      a{
		     text-decoration: none;
		   }
		   
	       /*L-V-H-A*/
	        a:link{
		      color: red;
		      font-size: 12pt;
		   }
		   a:visited{
		     color:blue;
		     font-size: 16pt;
		   }
		   a:hover{
		     background-color: #00FF00;
		     font-size:20pt;
		   }
		   a:active{
		     color:#FFFF00;
		   }
		   
		    input:focus{
		     background-color: #00FFFF;
		   }
		   
		   /*星號(hào)選擇器，選擇所有*/
		   *{
		     text-decoration: underline;
		   }
		   
		   /*屬性選擇器,所有具有type屬性的元素*/
		   [type]{
		      margin: 10px;
		   }
		   /*具有name屬性且屬性值為'math'*/
		   [name="math"]{
		      background-color: #0ff;
		   }
		   
		   a[href="http://www.w3school.com.cn/"][title="W3School"] {
		      color: red;
		   }
		   
		   /* 關(guān)聯(lián)選擇器---后代 */
		   h1 em{
		       color: red;
		   }
		   
		   /*子元素選擇器---兒子*/
		   p > em{
		      color: blue;
		   }
		   
		   /*相鄰元素選擇器---后續(xù)兄弟*/
		   li + li {
		     font-weight:bold;
		   }		

css Class Selector And id selector

CSS selector sorting

Class selector-2016 new course system html css video

The above is the detailed content of What are CSS selectors? CSS selector priority determination. For more information, please follow other related articles on the PHP Chinese website!