Select Page

WordPress Image Saturation – 如何改善圖片飽和度

WordPress Image Saturation – 如何改善圖片飽和度

朋友的 WordPress 網站內容都是關於圖片的攝影網站,影像圖片的檔案品質也都不錯,在本機(個人電腦)上瀏覽的效果也很好,就是發表到 WordPrss 網站以後,圖片影像的飽和度好像就是變差了。所以這一篇文章要來跟大家分享一下,在 WordPress 網站要如何改善圖片飽和度 WordPress Image Saturation,透過式樣的修改展示較好的影像圖片品質效果。

 

WordPress Image Saturation

 

影像圖片飽和度比較
影像圖片飽和度比較

 
 

  • 從上面的圖片可以看的出來式樣修改前後的差異(左:修改前/右:修改後),這次的技巧分享是透過 CSS3 filter 式樣的設計,讓影像圖片增加飽和度,然後可以在網頁上呈現較好的影像圖片效果。
  • 在子佈景主題的式樣檔(style.css),填入以下的語法。
  •  

  • 從三個數值去做設定來改變影像圖片的飽和度,contrast 對比/brightness 亮度/saturate 飽和,這三個參數可以隨自己的喜好與影像圖片的屬性,自行增減設計。
  • 範例式樣是針對網站全部的影像圖片作修改,所以可能會影響網站載入圖片的效率,請斟酌使用。
  • 如果對於式樣設計有點基礎的朋友,當然可以對任一指定的影像圖片是樣做單獨的設計。
  • 上述的式樣設計範例是以 Astrid 佈景主題作設計,也許不一定套用在您的佈景主題使用上,所以如果有無法套用的情況發生時,還是需要依據每個佈景主題對於影像圖片式樣設計來做修改。
  •  
     

    結論

    每一個 WordPress 網站都有其獨特性存在,所以並不是所有的設計套用上了就可以達成一樣的效果。為了追求更好的網頁瀏覽體驗,每一位網站管理者或是網頁設計師,如何精進自己的網站技巧,改善網頁設計效果,都是每一天努力的功課。很高興謝謝網路的發達,很多實用的技巧有很多的前輩分享給我們,所以認真的學習是不二的法門,跟大家一起共勉。

    About The Author

    max

    使用 WordPress 架設網站不再是一件痛苦的工作。這裡跟大家分享使用WordPress的相關問題與研究。 並且提供有關WordPress外掛程式,佈景主題等等的使用經驗分享。 幫助想要建立網站的朋友,可以簡單,快速,無痛苦的建立與使用網站。

    Leave a reply

    你的電子郵件位址並不會被公開。 必要欄位標記為 *

    網站架設

    WordPress 專屬主機