1. 程式人生 > >CSS入門(1)--css選擇器

CSS入門(1)--css選擇器

1 標籤選擇器

就是用標籤名來當做選擇器。

1)所有標籤都能夠當做選擇器,比如body、h1、dl、ul、span等等

2)不管這個標籤藏的多深,都能夠被選擇上。

3)選擇的是所有的,而不是某一個。所以是共性,而不是特性。

a{

                     text-decoration: none;

              }

2 id選擇器(大小寫嚴格區別)

1          #lj1{

2                               font-size: 60px;

3                               font-weight: bold;

4                               color:black;

              }

3 類選擇器

class屬性可以重複

1          <h3>我是一個h3啊</h3>

2                 <h3 class="teshu">我是一個h3啊</h3>

3                 <h3>我是一個h3啊</h3>

4                 <p>我是一個段落啊</p>

5                 <p class="teshu"

>我是一個段落啊</p>

       <p class="teshu">我是一個段落啊</p>

1          .teshu{

2                               color: red;

              }

4後代選擇器

空格就表示後代,.div1 p 就是.div1的後代所有的p

1          <styletype="text/css">

2                        .div1 p{

3                               color:red;

4                        }

       </style>

1          <divclass="div1">

2                        <ul>

3                               <li>

4                                      <p>段落</p>

5          <p>段落</p>

6          <p>段落</p>

7                               </li>

8                        </ul>

       </div>

5交集選擇器

選擇的元素是同時滿足兩個條件:必須是h3標籤,然後必須是special標籤。

交集選擇器沒有空格。

<style type="text/css">
		h3.special{
			color:red;
		}
	</style>
<h3 class="special">我是標題</h3><h3 class="special">我是標題</h3>

6並集選擇器(分組選擇器)

用逗號就表示並集

h3,li{
			color:red;
		}
<h3>我是一個標題</h3>
<ul><li>我是一個列表</li></ul>