標籤:技術分享 css基礎 logs 添加 兩種 class round html元素 attribute
一.CSS概述
css指的是層疊樣式表,樣式定義如何顯示HTML元素,樣式通常儲存在樣式表中,
把樣式添加到HTML4.0中,是為瞭解決內容和表現分離的問題。外部樣式表通常儲存在css檔案 中。多個樣式定義可層疊為一。
二.層疊次序
一般而言,所有的樣式都會根據下面的規則層疊於一個新的虛擬樣式表中,其中4擁有最高的優先權。
1.瀏覽器的預設設定
2.外部樣式表(通過引入的外部.css檔案)
3.內部樣式表(位於<head>標籤內部)
4.內聯樣式表(在HTML元素內部)
因此屬性的優先順序是內聯樣式表中優先於內部樣式表中的優先於外部樣式表中的,都優先於瀏覽器的預設設定。
三.CSS基礎文法
css的規則由兩個主要部分構成 選取器以及一條或多條聲明。
選取器通常是你需要改變樣式的HTML元素
每條聲明由一個屬性和一個值組成
屬性(property)是你所希望設定的樣式屬性(style attribute)。每個屬性有一個值,值和屬性之間以:分隔。
注意:聲明要用花括弧包圍起來。不同的聲明之間以分號隔開。
例如:
定義的就是改變h1標籤的字型顏色和字型大小
值得不同寫法和單位
例如在colr屬性中,我們不僅可以使用英文單詞來進行定義(red),還可以使用十六進 制的顏色值來進行定義(#ff0000)。
為了節約位元組,我們還可以使用css的縮寫形式p{color:#f00}
同時,我們還可以通過兩種方式來使用RGB值(通過對紅,綠,藍三種顏色的疊加來得到各種不同的顏色)。
1 p{ color:rgb(255,0,0) }
2 p{ color:rgb(100%,0%,0%) }
注意:當使用RGB百分比時,即使當值為0時,也要寫百分比符號,但是在其他,例如說寬度啊,像素啊!在這些後面就不需要使用單位了。
CSS的空格和大小寫
css對空格和大小寫,不敏感,是否包含空格不會影響到css在瀏覽器上的工作效果,同樣css對於大小寫也是不敏感的。但如果涉及到和HTML文檔一起工作的話 ,class和id名稱對大小寫是敏感的。
前端知識學習一 :CSS基礎