css的使用可以將顯示樣式分離出來，那麼css需要與html整合使用，就相當於將網頁內容與顯示樣式整合在一起。css和html有四種整合方式，本文就詳細講解這四種整合方式。
1.style樣式(內聯樣式)
style樣式就是將樣式直接通過style屬性表達出來。
css和html整合之style樣式表
2.內部樣式表
所謂內部樣式表，就是在元素之間定義的，並將樣式內容定義在元素之間。
css與html整合之內部樣式表
3.外部連線樣式表
在html檔案中通過與css檔案建立連線，從而在html中可以直接使用css檔案中的樣式。通過來與css檔案建立連線。
首先，將樣式定義在div.css檔案中，檔案內容如下：
divcss與html整合之外部連線樣式表
4.外部匯入樣式表
外部匯入樣式表，則是通過來匯入外部的css內容的。演示**如下：
css和html整合之外部匯入樣式表
5.優先順序比較
css和html整合有四種方式，接下來來看看這幾種方式的優先順序。
首先定義div.css檔案如下：
div
p
誰是第一優先順序
誰是第二優先順序
誰是第三優先順序
結合效果圖和**可以看出，style樣式的優先順序最高，當幾種整合方式都存在的時候，具有相同屬性時，style值能夠覆蓋其它的，如果沒有的則繼承過來，其次就是內部樣式表，覆蓋低優先順序衝突的以及繼承自身沒有但是低優先順序有的。因此整合方式的優先順序應該是從外到內，優先順序從低到高。
前端之 HTML和CSS
html和css作為前端工程師最基礎的所需具備的知識，需要前端工程師能夠深入地理解並且掌握。html控制頁面的內容，css控制頁面的樣式。這兩樣東西是使用者在頁面最直接看到的東西，所以也是最基礎 最重要的東西。萬丈高樓平地起，只有把地基打好，後續才能有更多的可能。如果你沒有乙個穩定的基礎結構，你在後...
HTML和CSS學習日記之CSS布局模型
三種布局模型 1 流動模型 flow 2 浮動模型 float 3 層模型 layer 流動模型 流動 flow 是預設的網頁布局模式。也就是說網頁在預設狀態下的 html 網頁元素都是根據流動模型來分布網頁內容的。特徵 第一點，塊狀元素都會在所處的包含元素內自上而下按順序垂直延伸分布，因為在預設狀...
HTML與CSS基礎之CSS定位
值 語義static 靜態定位 relative 相對定位 absolute 絕對定位 fixed 固定定位 邊偏移屬性 示例描述 toptop 80px 頂端偏移量，定義元素相對於其父元素上邊線的距離 bottom bottom 80px 底部偏移量，定義元素相對與其父元素下邊線的距離 left ...