前端學習(九) CSS基礎

2021-09-27 02:38:20 字數 1353 閱讀 3303

css的樣式可以寫在哪呢?其實css的樣式插入式十分靈活的

按照插入的形勢來看,可以分為三種情況

而接下來就對這三種情況進行簡單的討論

css樣式表是可以直接把**放在現有的標籤裡面去的

這種方法就稱為內嵌式:

文字顏色為紅色

把對應的style屬性,寫在p標籤的開始標籤中

css樣式**要寫在style=「」雙引號中,如果有多條css樣式**設定可以寫在一起,中間用分號隔開

文字顏色為紅色

有個新的任務百因必有果!你的報應就是我!,我想把百因必有果,你,我這三個變成紅色

要是用內嵌式的話,那可就太難了(每乙個標籤加入style=」color:red;」語句,如果有多個span呢?)

那麼嵌入式css樣式的編寫就能讓我們很快的解決這個問題

嵌入式樣式就是把css樣式**寫在標籤之間

統一設定span標籤的樣式:

嵌入式的css樣式必須寫在之間

並且一般情況下嵌入式css樣式寫在之間

那麼隨著專案需求的增多,我們的css**量也會更龐大,越發到了後期

我們上述的內聯式和嵌入式css樣式的方式肯定是不行的,那我們應該怎麼辦?

這個時候,我們可以使用將我們的css**編寫到另乙個單獨的檔案中,以為了後期方便維護我們的**

那麼這就是外部式css樣式

外部式css樣式(也可稱為外鏈式)就是把css**寫乙個單獨的外部檔案中,這個css樣式檔案以」.css」為副檔名

標籤位置一般寫在百因必有果!你的報應就是我!

span
我們發現,顏色是紅色,為什麼呢?因為這三種引入方式是優先順序的,誰的優先順序高瀏覽器就會顯示誰的樣式屬性

內聯式》嵌入式》外部式

重點來了!!嵌入式》外部式有乙個前提:嵌入式css樣式的位置一定在外部式的後面!

綠色:

百因必有果!你的報應就是我!

粉色:

百因必有果!你的報應就是我!

所以根本的優先順序其實是就近原則!,哪個離被修飾的元素近,用哪個樣式!

這也就是為什麼css叫層疊樣式表!

*****

*****

前端 CSS基礎理論總結(九)

css3圓角 陰影 rgba css3陰影 rgba 新的顏色值表示法 css3 transition動畫 transition delay 設定動畫的延遲 transition property duration timing function delay 同時設定四個屬性 舉例 css3 tra...

前端學習 CSS基礎(一)

css派生選擇器 id選擇器 w3school css 教程 示例 提示 以下例子中的 css 均位於 html 的 head 部分,這樣做的目的是為了利於演示例子本身。在實際的開發中,使用 css 最好的方式是引用外部樣式表。type text css body h1h2 pp.no2 style...

前端學習 CSS基礎設定

2.顏色表示 3.字型 4.行間距 7.以上僅為常見,更多搞手冊了解 畫素 px px 是網頁中使用最多的乙個單位,乙個畫素相當於螢幕中的乙個小點。螢幕由這些畫素點構成。畫素點越小,螢幕越清晰。百分比 使用百分比可以根據父元素的值來計算其大小,就永遠為父元素的一定比例大小,比較靈活,可以跟著父元素一...