background 屬性 個人心得

這兩天用到background樣式,所以就記錄一下!

首先background:background-color | background-image | background-position | background-attachment | background-repeat

       background-color :指定填充背景的顏色

       background-image:指定背景圖片

       background-position:控制背景圖片在元素中的位置

       background-attachment:用戶滾動頁面時圖片的狀態(scroll,fixed,inherit)

       background-repeat:是否重複背景圖片

然而,當我看完一篇blog之後,哇塞,原來還有好多新增屬性 ,如下

        1,background-clip:border-box | padding-box | content-box | no-clip

        背景顯示在border內 | 背景顯示在內補白內 | 只顯示在內容區域 | 無  (具體長啥樣,大家可以去試試,其實我也沒試敲打

        2,background-origin: border-box | padding-box | content-box  以邊框 | 內補白 | 內容盒子爲原點開始計算background-position

        3,background-size:contain | cover | 指定大小或百分比

        縮小圖片來適應圖片的尺寸 |  擴展圖片來填滿元素 | 指定圖片大小


先說那麼多,其實我只是用到了基礎屬性和background-size,感覺很方便,能夠解決一些問題,如定位圖標,就可以省去使用position定位。


竟然忘記記錄博主的網址了    http://www.chinaz.com/design/2009/0918/92150.shtml點擊打開鏈接

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章