CSS
CSS的特點:語言簡單,代碼可以重復使用,依賴于HTML
作用:給網頁進行樣式的開發與布局
不同的聲明操作同一個標簽時,根據代碼的自上而下順序進行執行(顯示代碼最后執行)
使用:Css的聲明:
第一種方法:公共標簽
<style type="text/css">
hr{
樣式
}
</style>
第二種:在標簽中直接聲明style屬性
第三種:使用link標簽引入外部聲明好的css文件
css選擇器:標簽選擇器:直接用標簽名來定義樣式 給網頁內所有該標簽添加相同的屬性
id選擇器:給標簽添加id,通過id唯一確定一個元素,屬性命名時,#id值 給某個指定的標簽添加指定的屬性
類選擇器:點類型 在元素標簽中添加class屬性,值為前面定義的類名 給不同的標簽添加相同的屬性
全部選擇 *{ } 給整個頁面添加相同的屬性
組合選擇器:選擇器1,選擇器2{ }j解決不同選擇器之間重復的樣式
子標簽選擇器x 選擇器1z子標簽選擇{ }
屬性選擇器: 標簽名【屬性名=屬性值】{ } 選擇某標簽指定某屬性具備某屬性值的屬性添加相同的屬性
表格樣式設置
1 width: 100; /* 設置表格高度 */ 2 border: solid 1px rad; /*設置邊框大小以及顏色*/ 3 border-radius: 10px; /*設置表格為圓角*/ 4 background-color: orangered;/*設置表格背景色*/ 5 text-align: center;/*將表格內容居中顯示*/ 6 color: blueviolet;/*設置表格內字體顏色*/ 7 font-size: 20px;/*設置字體大小*/ 8 font-weight: bolder;/*設置字體粗細*/ 9 letter-spacing: 10px;/*設置字的間距*/
1 list-style-type: none;/*去掉li標簽的標識符*/ 2 display: inline; /*讓標簽在一行排列*/ 3 float: left;/*設置左懸浮*/ 4 text-decoration: none;/*去除超鏈接的下劃線*/
盒子模型:
div:塊級標簽,主要用來進行網頁布局
默認寬度為頁面寬度,也可以設置,默認沒有高度
marginw外邊框
border邊框
height內容區域 設置寬高
paddingn內邊框
css定位:position
相對定位:relative 在元素原有位置的基礎上進行移動top,left,right,bottom。 其他元素位置不變
絕對定位:absolute 使界面參照父級具有相對定位元素的div進行移動,如果父級沒有定位時,就參照界面移動
固定定位:fixed 固定網頁某個位置不動,不隨滾動條改變
z-indexg改變顯示級別,(要求都為定位元素)1級最低

浙公網安備 33010602011771號