摘要：背景與邊框一背景背景顏色簡寫備注以下給設(shè)置可能不起作用需要用到背景圖片簡寫背景圖片的平鋪平鋪瀏覽器默認(rèn)平鋪只平鋪橫向和縱向不平鋪背景大小與位置大小大小屬性值的寫法有具體設(shè)置大小自適應(yīng)位置背景位置也是坐標(biāo)軸向下為正像右為

背景與邊框

?

? ??

一、背景(backgound)

1.背景顏色：background-color:red;(簡寫：background:color;)

備注：ie9以下給body設(shè)置background-color可能不起作用 需要用到bgcolor（）

?

2.背景圖片：background-image:url();(簡寫：background:url();)

?

3.背景圖片的平鋪

1).平鋪：瀏覽器默認(rèn)平鋪

2).只平鋪橫向和縱向：background-repeat:repeat-x;? ? ?background-repeat:repeat-y;

3).不平鋪：background-repeat:no-repeat;

?

4.背景大小與位置

大小：background-sizi:;

大小屬性值的寫法有 具體設(shè)置大小(200px 200px 100%? 100%) auto自適應(yīng)

?

位置：background-repeat:;

背景位置(也是坐標(biāo)軸) 向下為正 像右為正 屬性值有 具體數(shù)字 百分比 英文 單詞

?

5.背景的簡寫backgrpund:red url(01.png) no-repeat 50% 50%;? ? 分別是 顏色 路徑 平鋪 位置

?

?

?

?二、邊框(border)

這里前面說了簡寫 咱們邊框就直接用簡寫吧

1.簡寫border:red 2px dashed;分別是邊框的顏色 粗細(xì) 線條(虛線：dashed? ?實(shí)線：solid)

?

2.邊框圓角：border-radius:30px;（200px會(huì)變成一個(gè)圓）

圓(border-radius:200px;)

border不簡寫：

邊框顏色：border-color:red;

邊框粗細(xì)：border-width:2px;

邊框線條：border-style:solid;

邊框圓角：border-radius:200px 200px;

?

?

?

?

?

?

?

?

?

?

?

?

?

?