通過css來轉換塊級元素和內聯元素

區分這2種元素最好的方式就是看，該元素是否是獨占一行，獨占一樣的就是塊級元素，否則就是內聯元素。

將上面的代碼存為html文件，就會看到div元素在一行，span元素就是獨占一行的。

這個就是css的基本用法。

html文件引入css的3種方式

totonoo

建main.css文件

.text { color: #ffcc00; }

css優先級

第一原則：默認<外部引入<內聯樣式<行內

第二原則：內聯樣式 > ID 選擇器 > （類選擇器 = 屬性選擇器 = 偽類選擇器） > （標簽選擇器 = 偽元素選擇器）

偽類元素：

!important 最高

首先偽類是用單冒號表示：如:link, :visited, :hover, :active, :focus, :first-child, :last-child, :nth-child, :nth-last-child, :not()

然后偽元素用雙冒號表示：如::first-letter, ::first-line, ::before, ::after

1.用于鏈接的幾個偽類元素

:link用這個可以設置未被訪問的鏈接的樣式

:visited用這個設置已經被訪問的鏈接的樣式

:hover 用于設置將鼠標懸浮在鏈接上的樣式

:active用于設置鼠標點擊鏈接時到鼠標松開時的樣式

:focus 用于設置用鍵盤將焦點放在鏈接上時的樣式（如用tab鍵或者上下鍵來移動頁面焦點時）

position:absolute 絕對定位

position:relative 相對定位

position:fixed 固定定位

子絕父相

使用CSS重置（reset）

css重置庫如normalize.css已經被使用很多年了，它們可以為你的網站樣式提供一個比較清晰的標準，來確?？鐬g覽器之間的一致性。

大多數項目并不需要這些庫包含的所有規則，可以通過一條簡單的規則來應用于布局中的所有元素，刪除所有的margin、padding改變瀏覽器默認的盒模型。

*{ box-sizing:border-box; margin:0; padding:0 }

使用box-sizing聲明是可選擇，如果你使用下面繼承的盒模型形式可以跳過它。

CSS

版權聲明：本文內容由網絡用戶投稿，版權歸原作者所有，本站不擁有其著作權，亦不承擔相應法律責任。如果您發現本站中有涉嫌抄襲或描述失實的內容，請聯系我們jiasou666@gmail.com 處理，核實后本網站將在24小時內刪除侵權內容。