CSS引入方式-行內式
通過 style這個標簽屬性,將css鍵值對直接寫入標簽內
1 <p style="width: 100px;height: 100px;background: red;"></p> 2 <!--注釋:這段代碼描述的是一個寬高為100px,背景為紅色的容器-->
css引入方式-內嵌式(嵌入式)
使用style標簽將css屬性名和屬性值引入到html頁面中,通常style標簽放置在head標簽中,為什么css樣式要放置在head標簽中呢,因為代碼從上到下執行,如果先加載結構,那么用戶看到的就將是干巴巴的內容,而沒有通過美化,而先加載樣式后加載結構,就相當于孩子出生就是穿著衣服的!
1 <head> 2 <style type="text/css"> 3 p{ 4 width: 100px;height: 100px;background: red; 5 } 6 </style> 7 </head>
以上代碼描述的也是一個寬高為100px,背景為紅色的容器,只不過是通過內嵌式引入的!
css引入方式之外鏈式
通過link標簽將獨立的css檔案引入到html頁面中
1 <link rel="stylesheet" type="text/css" href="https://www.cnblogs.com/webaction/p/style.css">
rel="stylesheet"描述了當前頁面與href所指定的檔案的關系,即說明的是href鏈接的檔案是一個新式表,type="text/css"是指定MINME型別,也就是css檔案,href="https://www.cnblogs.com/webaction/p/style.css"規定被鏈接檔案的位置
css引入方式之匯入式
1 <style type="text/css"> 2 @import url("style.css"); 3 </style>
通過@import url引入一個獨立的CSS檔案,url("style.css")規定被鏈接檔案的位置
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/2378.html
標籤:Html/Css
上一篇:CSS的簡介和語法
