類選擇器和 ID選擇器

一、類選擇器

語法:

.類選器名稱{css樣式代碼;}

注意:

1、英文圓點開頭

2、其中類選器名稱可以任意起名(但不要起中文噢)

使用方法:

第一步:使用合適的標簽把要修飾的內容標記起來,如下:<span>膽小如鼠</span>

第二步:使用class="類選擇器名稱"為標簽設置一個類,如下:<span class="stress">膽小如鼠</span>

第三步:設置類選器css樣式,如下:.stress{color:red;}

/*類前面要加入一個英文圓點*/


二、ID選擇器

在很多方面,ID選擇器都類似于類選擇符,但也有一些重要的區別:

1、為標簽設置id="ID名稱",而不是class="類名稱"。

2、ID選擇符的前面是井號(#)號,而不是英文圓點(.)。

三、類和ID選擇器的區別

相同點:可以應用于任何元素

不同點:

1、ID選擇器只能在文檔中使用一次。與類選擇器不同,在一個HTML文檔中,ID選擇器只能使用一次,而且僅一次。而類選擇器可以使用多次。

2、可以使用類選擇器詞列表方法為一個元素同時設置多個樣式。我們可以為一個元素同時設多個樣式,但只可以用類選擇器的方法實現,ID選擇器是不可以的(不能使用 ID 詞列表)。


最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 類選擇器可以同時控制多個標簽,只要賦予這些標簽相同的類屬性就可以實現。 一個class類屬性內可以有多個值 id選...
    YAN7閱讀 2,033評論 0 0
  • CSS基礎 本文包括CSS基礎知識選擇器(重要!!!)繼承、特殊性、層疊、重要性CSS格式化排版單位和值盒模型浮動...
    廖少少閱讀 3,114評論 0 40
  • Spring Cloud為開發人員提供了快速構建分布式系統中一些常見模式的工具(例如配置管理,服務發現,斷路器,智...
    卡卡羅2017閱讀 134,837評論 18 139
  • 第6章 開始學習CSS,為網頁添加樣式 1、認識CSS樣式CSS全稱為“層疊樣式表 (Cascading Styl...
    夏沫xx閱讀 1,069評論 1 11
  • CSS全稱為“層疊樣式表 (Cascading Style Sheets)”,它主要是用于定義HTML內容在瀏覽器...
    百作不死的學習閱讀 1,187評論 0 7