噗浪plurk
噗浪背景問題 CSS
我最近改了噗浪背景是河道 主面板一起改的不是分開也就是一個圖片而已但是它會重覆= =不管圖片的size如何都一樣我希望他能夠放大耶就只有一張不要重覆有沒有辦法讓圖片放大
Dear ~不論是 → 檢視圖片 還是 檢視圖片 ← 這兩張圖片的尺寸各為 602 x 368、604 × 453
倘若您的螢幕解析度在 600 x 480 以上
即使設定圖片為不重複排列
看到的背景圖永遠都是不會佔滿整個畫面!
倘若您的解析度是 1024 x 600 或更大
那麼看到的背景圖在整個畫面的比例會更小。
圖片放大必須運用 background-size 屬性
例如:background-size:1280px 1024px;
不過
只有少數瀏覽器支援
也就是說
如果您或訪客使用 IE 就看不到圖片放大的效果。
而且不論是利用 CSS 放大圖片還是透過修圖軟體放大圖片
放大後的圖片都會有失真的問題
因此建議如果希望背景圖能與畫面一樣大小
那麼請另外尋找一張與您的螢幕解析度相同尺寸的圖片來當背景!
瞭解以上觀念後
我們來看一下您目前的噗浪樣式該如何修改才能得到最佳效果。
檢視圖片請依照以下方法增減語法
步驟缺一不可
否則會得不到效果唷!
在 CSS 樣式表中刪除以下語法:停用body
html {background-image: url(http://images.plurk.com/xxxxfdc88.jpg);background-repeat:no-repeat;-o-background-size:800px 500px;-webkit-background-size:800px 500px;-moz-background-size:800px 500px;}停用#timeline_holder {background:url(http://images.plurk.com/xxxxbb300a.jpg);自訂河道背景}停用body
html {background:url(http://images.plurk.com/xxxxbb300a.jpg);自訂下方背景}接著把原來的:body
html {background: url(http://images.plurk.com/xxxxbb300a.jpg);border:hidden; margin: 0;} 改成:body
html {background: url(http://images.plurk.com/xxxxbb300a.jpg) no-repeat center center fixed;} 檢視圖片如前所述:假使對這樣的結果不滿意
請另外尋找 1280 x 1024 以上的背景圖。
希望對您有所助益~ ^_^