【Python自學筆記】CSS-background(背景)


background的屬性

background屬性

  • background-attachment:fixed固定的背景圖像;默認值是是:scroll;更多參數
  • background-repeat:平鋪方式`可以設置背景圖片的平鋪方式:
    • repeat-x:在x軸進行平鋪;
    • repeat-y:在y軸進行平鋪;
    • no-repeat:只平鋪一次;
    • repeat:缺省值,平鋪所有。
  • background-position:水平位置 垂直位置:設置背景圖像的起始位置;
    • 水平方向:left center right;
    • 垂直方向:top center bottom;
    • left top:缺省值,左上;
    • left center:左邊的中間位置;
    • left bottom:左邊的底部;
    • 以此類推:一共有 9 種情況。
    • 注意:position還可以設置爲具體的數值(且可以爲負值),例如:background-position:10px 20px;
  • position 和 color可以同時設置,且position在color上面
  • background屬性合在一起設置;
    • 例如:background:ur;(images/bg.jpg) -20px 10px no-repeat gold;
    • 可以只寫一部分值,background會自動判斷識別;
    • 屬性順序可以改變。
  • 在實際開發中我們可以使用Chrome瀏覽器的開發工具來輔助調整背景

雪碧圖

  • 什麼是雪碧圖[外鏈圖片轉存失敗,源站可能有防盜鏈機制,建議將圖片保存下來直接上傳(img-OqTYeyXq-1585829971750)(https://i.loli.net/2020/04/02/No5zT7kC3uPnUMQ.png)]

  • 參考文檔

  • 更多內容