溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
本篇內容主要講解“總結CSS基礎知識”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“總結CSS基礎知識”吧!
一、CSS簡介
css:層疊樣式表 英文全名：cascading style sheets
,WEB標準中的表現標準語言,表現標準語言在網頁中主要對網頁信息的顯示進行控制，簡單說就是如何修飾網頁信息的顯示樣式。
目前推薦遵循的是W3C發布的CSS3.0.
用來修飾XHTML或者XML等樣式文件的計算機語言。
1998年5月21日由w3C正式推出的css2.0
二、CSS語法
CSS語法：選擇符{屬性：屬性值；屬性：屬性值；}
選擇符表示要定義樣式的對象，可以是元素本身，也可以是一類元素或者制定名稱的元素.
屬性：屬性是指定元素所具有的屬性，它是css的核心，css2共有150多個屬性
屬性值：屬性值包括法定屬性值及常見的數值加單位，如25px，或顏色值等。
說明：
1）每個CSS樣式由兩部分組成，即選擇符和聲明，聲明又分為屬性和屬性值；
2）屬性必須放在花括號中，屬性與屬性值用冒號連接。
3）每條聲明用分號結束。
4）當一個屬性有多個屬性值的時候，屬性值與屬性值不分先后順序。
5）在書寫樣式過程中，空格、換行等操作不影響屬性顯示。
三、樣式的創建(內部樣式表 外部樣式表 內聯樣式表)
A、內部樣式表
語法：
<style type="text/css">
/*css語句*/
</style>
注：使用style標記創建樣式時，最好將該標記寫在<head></head>;
B、外部樣式
*方法一：外部樣式表的創建：
<link rel="stylesheet" type="text/css" href="目標文件的路徑及文件名全稱" />
說明：
使用link元素導入外部樣式表時，需將該元素寫在文檔頭部，即<head>與</head>之間。
rel（relation）：用于定義文檔關聯，表示關聯樣式表；
type：定義文檔類型；
*方法二：外部樣式表的導入
<style type="text/css">
@import url(目標文件的路徑及文件名全稱);
</style>
注：@和import之間沒有空格 url和小括號之間也沒有空格；必須結尾以分號結束；
C、內聯樣式 （行間樣式，行內樣式，嵌入式樣式、內嵌樣式）
語法：<標簽 style="屬性：屬性值;屬性:屬性值;"></標簽>
例：<div style="width:500px; height:200px;"></div>
四、兩種引入外部樣式表link和import之間的區別
擴展知識點：link和import導入外部樣式的區別：
差別1：本質的差別：link屬于XHTML標簽，而@import完全是CSS提供的一種方式。
差別2：加載順序的差別：當一個頁面被加載的時候（就是被瀏覽者瀏覽的時候），link引用的CSS會同時被加載，而@import引用的CSS會等到頁面全部被下載完再被加載。所以有時候瀏覽@import加載CSS的頁面時開始會沒有樣式（就是閃爍），網速慢的時候還挺明顯。
差別3：兼容性的差別：@import是CSS2.1提出的，所以老的瀏覽器不支持，@import只有在IE5以上的才能識別，而link標簽無此問題。
差別4：使用dom(document object model文檔對象模型 )控制樣式時的差別：當使用javascript控制dom去改變樣式的時候，只能使用link標簽，因為@import不是dom可以控制的.
五、樣式表的優先級
A、內聯樣式表的優先級別最高
B、內部樣式表與外部樣式表的優先級和書寫的順序有關，后書寫的優先級別高。
C、作用域：內聯樣式的作用域最小，只能應用于當前元素，其次是內部樣式表，能應用于當前HTML文件，最后是外部樣式表，能應用于所有鏈接的HTML文件。
到此，相信大家對“總結CSS基礎知識”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
