background-image: url(index_photos_01.jpg);
background-repeat: no-repeat;
background-attachment:fixed;
background-position:50% 50%;
">
background-image: url(index_photos_01.jpg); 指定圖片路徑
background-repeat: no-repeat; 不要重複圖片
background-attachment:fixed; 和下面background-position搭配決定位置
background-position:50% 50%; 50 50 代表中間
-moz-background-size:auto; /*for Firefox*/
-webkit-background-size:auto; /*for Google Chrome、Safari*/
-o-background-size:auto; /*for Opera*/
background-size:auto; /*for IE*/ - 預設值為auto，即背景圖片原始長寬。
- length指定圖片具體大小的數值，不允許負值。
- percentage以背景圖所在元素的百分比指定背景圖大小，不允許負值。
- length與percentage可設定2數值，也可只設定1個數值，當只設定一個數值，另一個數值(高)預設值為auto，此時高度以背景圖原始寬高比例，自動縮放。
- cover主要用於背景圖小於所在的內容，而背景圖又不適合使用repeat，此時就可以採用cover的方式，使背景圖放大至內容的大小，但此方法容易使背景圖因放大而失真。
- contain與cover正好相反，主要用於背景圖大於所在內容，但卻需要將背景圖完整呈現，此時就可採用contain的方式，使背景圖縮小至內容的大小。
沒有留言:
張貼留言