什么是CSS？
????????css(Cascading Style Sheets)是層疊樣式表或級聯樣式表，是一組設置規則，用于控制web頁面外觀。
為什么使用CSS?
????????CSS 用于定義網頁的樣式，包括針對不同設備和屏幕尺寸的設計和布局。
CSS 實例
body {background-color: lightblue;
}h1 {color: white;text-align: center;
}p {font-family: verdana;font-size: 20px;
}CSS的特點：
????????css規則是由兩部分組成：選擇器和一條聲明或多條聲明。
什么是選擇器：
????????選擇器通常指你需要改變的HTML元素的標簽名、類名或ID名。
什么是聲明？
????????每一組聲明都有一個屬性和值組成，屬性是你希望改變的樣式名。
<head><meta charset="utf-8"><title></title><style type="text/css">/* *（通配符）選擇器選中所有元素 */*{color: #ff4100;width: 100px;}/* 選中#dis下所有的元素 */#dis *{color: blue;width: 100px;}</style>
</head>
<body><div id="dis" class="dec"><p>#dis下的p標簽</p><h2>#dis下的h2標簽</h2>... ...</div>
</body>CSS 的引入方式
css常用引入方式：標簽內（內聯） 頭部引入 外部引入
CSS是和html結合使用
根據定義CSS的位置不同，分為標簽內（內聯）、頭部樣式和外部樣式。
頭部引入
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>css的引入方式</title><!-- 頭部引入 --><style type="text/css">h1{color: yellow;}</style></head><body><h1>你好，世界！！！</h1></body>
</html>
內聯（標簽內）引入
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>css的引入方式</title></head><body><!-- 標簽內（內聯） --><p style="color: red;">熊大最帥！！！</p></body>
</html>外部引入
/* index.css */
/* css外部文件 */
li{color: green;
}
.ps{color: pink;
}@import 引入
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>css的引入方式</title><!-- 外部引入-方法1 --><style type="text/css">@import url("./css/index.css");/*這里不予許在寫任何樣式*/</style> </head><body><h1 class="ps">你好，世界！！！</h1><ul><li>你好，前端！！！</li></ul></body>
</html>link引入
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>css的引入方式</title><!-- 外部引入-方法二 --><link rel="stylesheet" type="text/css" href="./css/02cssyinru.css"/></head><body><h1 class="ps">你好，世界！！！</h1><ul><li>你好，前端！！！</li></ul></body>
</html>
引入方式的優先級及語法
優先級（就近原理）
標簽內（內聯） ==> 頭部引入 ==> 外部引入
<!-- 優先級演示 -->
<p class="ps" style="color: red;">最終的效果</p>語法及優缺點
????????標簽內（內聯）
????????語法：<p style="屬性:值;..."></p> ? 優點：優先級高 ? 缺點：冗余代碼過多，不利于維護 ? 適用場景：個別特殊樣式適用。
頭部引入
????????語法：
<head>
? <style>
? p{
? 屬性:值;
? 屬性:值;
? ...
? }
? </style>
? </head> ????????優點：速度快，沒有服務器請求壓力 ?。
????????缺點：不易改版，代碼可讀性差，不易于前后臺溝通 ?。
????????適用場景：單頁面適用。
?
外部引入
????????語法：
1、<style>
? @import url("外部css文件");
? </style>2、<link rel="stylesheet" href="外部css文件">????????優點：一個文件可以控制多個頁面樣式，利于維護，利于前后臺溝通 ?。
????????缺點：冗余代碼過多，有服務器請求壓力 ?。
????????適用場景：各大企業官網。
link與@import的區別
區別1： ?
????????link是XHTML標簽，除了加載css外還可以加載RSS等其他事務 ? @import是屬于css范疇，只能加載css ?。
區別2： ?
????????link是XHTML標簽，無兼容性問題 ? @import是在css2.1提出的，低版本瀏覽器不支持 ?
區別3：
???????? ? link引入css時，在頁面加載時同時加載css ? @import需要HTML頁面完全載入后再加載css ?。
區別4： ?
????????link支持使用javascript控制DOM改變樣式 ? @import不支持使用javascript控制DOM改變樣式。
![使用異步特征引發的錯誤error[E0195]: lifetime parameters or bounds on method `before_save`](http://pic.xiahunao.cn/使用異步特征引發的錯誤error[E0195]: lifetime parameters or bounds on method `before_save`)
