css重要標簽總結
一、css背景標簽
1，設定背景顏色
back-ground-color 屬性指定元素的背景色，
小實體如下圖所示：
運行結果如下：
可以通過選擇器給不同的標簽設定不同的顏色，在這里h1,div,和p標簽將擁有不同的背景色：
實體：
運行結果如下圖所示：
2.設定背景影像
background-image屬性指定用作元素背景的影像，默認情況下，影像會重復，以覆寫整個元素，用url來引入外部圖片，
具體實體如下所示：
運行結果如下圖：
注意事項：使用背景圖片時，要注意背景圖片的樣式，不要有干擾到文本的影像，以免影響效果，
css背景重復的問題
默認情況下，background-repeat屬性在垂直和水平方向上都重復影像，某些影像應只適合水平或垂直方向上重復，若想僅在水平方向上重復，需要用（background-repeat：repeat-x；），則背景看起來更好；若想要僅在垂直重復影像，需設定background-repeat：repeat-y；
屬性還可以指定只顯示一次背景影像：用background-repeat：no-repeat標簽即可，
4、指定背景影像的位置
指定背景影像的位置需要使用background-position標簽
具體實體如下圖所示：
下面將會展示把背景圖片放在右上角的代碼：
運行結果如下圖所示：
5、設定背景影像固定
background-attachment 屬性來設定背景影像固定，其屬性值scroll影像隨頁面元素一起滾動（默認值），fixed影像固定在螢屏上，不隨頁面元素滾動，
6、設定背景影像大小
background-size 屬性可以設定背景影像的高度和寬度，第一個值設定寬度，第二個值設定高度，如果設一個值，則第二個值會默認auto，其格式如下所示：
background-size：屬性1 屬性2；
實體如下：
運行結果如下：
7、設定影像透明效果
使用opacity屬性能夠使任何元素能夠使任何元素呈現出透明效果，透明度在0~1之間，其格式如下：
opacity：opacityValue；
二、css邊框標簽
1.設定邊框顏色
（1）設定邊框樣式（border-style）
邊框樣式用于定義邊框的風格，常用屬性值如下：
none： 沒有邊框即忽略所有邊框的寬度（默認值），
solid：邊框為單實線，
dashed：邊框為虛線，
dotted: 邊框為點線，
double：邊框為雙實線，
既可以對盒子的單邊進行設定，也可以綜合設定四條邊的樣式，使用border-style屬性綜合設定四邊樣式時，必須按照上右下左的順時針順序；省略時采用值復制的原則，即一個值為四條邊；兩個值為上下/左右；三個值為上/左右/下，
border-top-style： 上邊框樣式
border-right-style：右邊框樣式，
borer-bottom-style：下邊框樣式，
border-left-style：下邊框樣式，
border-style：上邊框樣式 右邊框樣式 下邊框樣式 左邊框樣式
border-style： 上邊框樣式 左右邊框樣式 下邊框樣式，
border-style：上下邊框樣式 左右邊框樣式，
border-style：上下左右邊框樣式，
（2)設定邊框寬度（border-width）
border-width 屬性用于設定邊框的寬度，其格式如下
border-width：上邊[右邊 下邊 左邊];
在上面的語法格式中，border-with 屬性常用取值單位像素px，并且同樣遵循值復制的原則，其屬性值可以設定1~4個，即一個值為四邊，兩個值為上下/左右，三個值為上/左右/下，四個值為上/右/下/左，具體如下：
border-top-width： 上邊框寬度
border-right-width：右邊框寬度，
borer-bottom-width：下邊框寬度，
border-left-width：下邊框寬度，
border-width：上邊框寬度 右邊框寬度 下邊框寬度 左邊框寬度
border-width： 上邊框寬度 左右邊框寬度 下邊框寬度，
border-width：上下邊框寬度 左右邊框寬度，
border-width：上下左右邊框寬度，
（3）設定邊框顏色（border-color）
border-color屬性用于設定邊框顏色，其格式如下：
border-color：上邊[右邊 下邊 左邊];
設定邊框樣式的同時必須設定邊框樣式，如果未設定樣式或者設定為none，則其他的邊框屬性無效，邊框顏色的單邊與綜合設定，順時針順序，與上面的寬度和樣式屬性的設定規則相同，在這里就不一一描述了，
（4）綜合設定邊框
border-top：上邊框寬度 樣式 顏色，
border-reight：右邊框寬度 樣式 顏色
border-bottom：下邊框寬度 樣式 顏色
border- left：左邊框寬度 樣式 顏色
border：四邊寬度 樣式 顏色
（5）圓角邊框
border-radius屬性用于向元素添加圓角邊框：
其語法格式如下圖所示：
border-radius：引數1/引數2
其中“引數1”表示圓角的水平半徑，“引數2”表示圓角的垂直半徑，兩個引數之間用“/”隔開，需要注意的是，在使用border-raidius屬性時，如果第二個引數省略，則會默認等于第一個引數，通過border-radius設定邊框圓角，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/279994.html
標籤：其他