week6 10月14日 CSS樣式(二)

2021-07-05 20:04:59 字數 1954 閱讀 6452

一、複習

1、樣式表的書寫方式

2、已經講過的選擇器的優先順序

3、練習測試(在規定時間內上交)

二、新課

(一)元素指定選擇符

1.標記名#id指定選擇符

標記名#id屬性值

例如:p#first

則該樣式表僅對標記有效,由於id屬性值必須惟一,等價:#first ,這樣寫可以針對老版本瀏覽器。

注意:標記名與「#」之間、「#」前後都不能有空格。

2.標記名.class指定選擇符標記名.樣式類名

僅對指定標記型別且使用calss="樣式類名"的標記有效。

該方式可用於對同一類標記再進行分類,有選擇的指定其中一部分標記。例如需要對頁面中多個超連結分組指定不同的樣式,則可以按組分別指定calss屬性,再使用a.class選擇符為不同組的超連結定義樣式表。

注意:標記名與「.」之間、「.」前後都不能有空格。

(二)群組與通用選擇符

1.群組選擇符

標記名選擇符, #id選擇符,  .class選擇符, ……

群組選擇符就是將任意多個標記名、id、class選擇符用逗號隔開共同定義乙個樣式表,該樣式表對所有的選擇符都有效,相當於對各個選擇符單獨定義了完全相同的樣式表。

例如:p, h3, div  

#first, .sec, .item, div

2.通用選擇符

* 通用選擇符是乙個特殊的群組選擇符,用萬用字元*表示任意標記,為頁面中所有元素定義通用的樣式規則,就是說該方式定義的樣式表對頁面中的所有標記都有效,包括標記。

(三)包含與子物件選擇符

多個選擇符用空格隔開的組合稱為包含選擇符,該樣式表僅對按選擇符順序都符合條件的標記有效,就是說只對按選擇符順序逐級包含在最內層的標記有效。相當於多條件選擇樣式表,只對符合條件的標記有效。

1.標記名包含選擇符

標記名1 標記名2  …

標記名包含選擇符僅對按順序包含在最內層的標記有效,標記名之間必須用空格隔開。

例如:div li span  

注意:包含選擇符的多個標記名之間用空格隔開而不是逗號,如果用逗號隔開就是群組選擇符—對所有標記都有效。 

2.id標記名包含選擇符

#id屬性值  標記名

該樣式表僅對使用了指定id標記內所包含的所有指定型別的標記有效。雖然id標記只有乙個,但其內部的多個指定型別的標記都使用該樣式。

例如:#sidebar  img

#sidebar  h2 

3.class類名標記名包含選擇符

.樣式類名 標記名

該樣式表對所有使用calss="樣式類名"標記內所包含的指定標記有效。

例如:.fancy  td

(四)相鄰選擇符

除了使用包含選擇符用外層標記為條件對其包含的標記指定樣式表外,還可以根據標記的前後關係用前乙個標記為條件,對它相鄰的下乙個標記指定樣式表—相鄰選擇符。

標記名||id屬性||class類選擇符+ 標記名||id屬性||class選擇符

相鄰選擇符僅對它前面的乙個標記必須滿足「+」前選擇符條件、而它自己又滿足「+」後選擇符條件的那些標記定義樣式表。

例如:span+p

則該樣式表僅對之後相鄰的下乙個標記有效,對標記無效、對前面相鄰不是的標記也無效。

再例如:.one+.two  

則該樣式表僅對使用了class="one"的標記之後相鄰的下乙個、且必須使用class="two"的那些標記有效。

3月14日 週日

現在不明白該怎麼整理學到的數學知識了,好像看了半天到頭來頂多就是複述一遍看過的東西,懂了沒懂自己也不太清楚,會不會用更不能確定。現在看一部分都大體能有自己的想法了,雖然實際好像沒什麼結果,當然我也不能確定是因為學習數學得以鍛鍊的思維。不過從最近做題情況,不論是自己做還是一起做題都能感覺到對 的荒廢實...

隨筆 8月14日

懶惰的情緒總是很難牴觸,即使很多時候我們已經很努力克制自己,但是大腦中去總有一種負面的情緒。這最終不是我們能控制的了的,最好的方法是把它當做自己的孩子或學生來培養,不要從心理層面上過於自責,要善待自己,調節好心態,才能從積極的一面理性的思考自己應該去怎麼做,才能戰勝自己。今天早上起床學英語有點懶散,...

11月14日筆記

namespace 命名空間 用於解決類重名問題,可以看做 類的資料夾 如果 和被使用的類在乙個namespace則不需要using。在不同命名空間下的類呼叫有兩種方法 寫全稱 命名空間.類名 先using引用命名空間,再呼叫 using可以宣告namespace的引入,還可以實現非託管資源的釋放,...