確保縮圖同尺寸

確保縮圖同尺寸

有時縮圖列表若上傳的照片比例不同,會造成雜亂感,這時只要在照片外層再套上一件衣服,大家看起來就都一樣囉

HTML:

<p class="image-container">
<img src="xxx.png">
</p>

CSS:

p.image-container {
width: 100%;
height: 0;
padding-bottom: 60%; /*5:3,如果4:3就是75%,以此類推*/
overflow: hidden;
}

p.image-container img {
width: 100%;
}

 

 




 迴響列表

目前還沒有任何留言


 留言表單

如果想要使用回覆功能,或是刪除修改自己的留言,可以登入網站後再來留言。

留言支持 Markdown 格式





關於我

在這個年代,個人網站的存在是非常難能可貴的。何況還是自己寫的,簡直就是人間的塊寶,世界的遺產。

Read More
艾吉碎碎唸
最新PO文
Go to Blog
文章分類
Social Accounts