CSS 之 背景 (background) 屬性說明

由於html語法會被解析,所以不能發code,用圖片代替。



p {
background-image: url(img.gif);
}
執行結果:



加入 CSS 樣式,background-repeat 是否重覆,預設是x軸和y軸重覆執行結果如上圖。
p {
background-image:url(img.jpg);
background-repeat: no-repeat;
}

background-repeat: no-repeat; 不重覆背景圖片,執行結果如下:



background-repeat: repeat-x; 只重覆x軸,執行結果如下:



repeat-x 這是不斷重覆至瀏覽器右邊界,而且隨瀏覽器,左右拉動而改變。

background-repeat: repeat-y; 只重覆y軸,執行結果如下:



repeat-y 只重覆到文字結束那行。

---------------
加入 CSS 樣式,background-position 顯示背景圖位置,它後面必需跟2個參數,

分別是上中下(top,center,bottom),左中右(left,center,right),各選其一。

例如:background-position: center center; 執行結果如下:



那2參數也可以設%來調整位置,如 background-position: 30% 30%; 執行結果如下:



介紹大約就到這邊,不過我想只有background-repeat: no-repeat;這參數用的到吧,不然就不設都重覆。

.

沒有留言:

發佈留言

由於文章被灌水,什麼是灌水?就是類似非人為的機械式程式,留下了一大堆的廣告連結。所以當您發表留言之後,則還需要耐心的等待博客作者的審核,於審核過後才會公開您的留言。意思就是您不需要再重複的做一次留言。最後在此非常的感謝,您願意花費許多時間來撰寫留言。
Hello my friend, I have no money, I am very poor, My blog is super chill, I welcome your comments, but in order to maintain a healthy discussion, Please avoid spam or irrelevant comments.