確保縮圖同尺寸-我是一個金艾吉

確保縮圖同尺寸

確保縮圖同尺寸

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

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%;
}

分享這篇PO文

迴響列表

目前還沒有任何留言

留言表單