#190640 gửi bởi phonggio12c
Ngày 07 Tháng 02 2019 , 06:29
Mình chia web ra làm 4 cột (col-sm-6)
Kích thước ảnh thì randoom như sau
Ảnh 1 ở cột 1: 200x300px
Ảnh 2 ở cột 2: 260x411px
Ảnh 3 ở cột 3: 122x514px
Ảnh 4 ở cột 4: 222x333px
H làm thế nào mà sửa kích thước ảnh đẹp đẽ đồng đều
KHÔNG: ép cố định kích thước
nó tự responsive
mình từ ép cố định thì cái dài ngoằg ra, cái thì co rúm ró lại
xin cảm ơn
#190642 gửi bởi phonggio12c
Ngày 08 Tháng 02 2019 , 02:35
nguyenvantuan đã viết Bạn thêm class="img-responsive" là đc. Nếu ko đc thì gửi link demo lên

class="img-responsive" ko giải quyết đc, nó chỉ giúp ảnh co giãn đúng với thiết bị thôi
còn nếu kích thước ảnh khác nhau thì nó ko đồng đều
có 2 ảnh trong cùng một row, kích thước

ảnh 1 w:150px h:312px
ảnh 2 w211px h:116px

h giải quyết sao cho 2 ảnh trên tự động co giãn đúng kích thước: w:xxx h:yyy mà ko bị vỡ ảnh

#190643 gửi bởi hoaquynhtim99
Ngày 08 Tháng 02 2019 , 03:21
Bạn dùng background cover để giải quyết cái này. Ví dụ:
https://nukeviet.vn/vi/store/
Để ý các ảnh đại diện của ứng dụng

<div class="fix-img" style="background-image:url('/assets/store/images/2018_12/fb-customer-chat.png');">
<a href="/vi/store/blocks/fb-customer-chat/">
<img src="/assets/images/pix.gif" alt="Block Facebook Customer Chat">
</a>
</div>

CSS:

.store-ex-item .c1 .fix-img {
overflow: hidden;
width: 80px;
height: 80px;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
background-color: #eee;
}

Để chỉnh kích thước responsive bạn có thể CSS width: 100%; height: 1px; padding-bottom: 35%; chẳng hạn

Hãy sống là chính mình, bình thường nhưng không tầm thường.
#190647 gửi bởi phonggio12c
Ngày 09 Tháng 02 2019 , 06:31
vẫn ko đc ạ
đây là kích thước ảnh không cố định
áds
h giải quyết như thế nào để nó như vầy
sdsd
mà ko bị vỡ hình (ảnh to nó tự resize nhỏ, ảnh nhỏ nó sẽ resize to hơn theo đúng tỉ lệ trong thẻ div, chứ ko phải nó resize theo div)
df
#190649 gửi bởi hoaquynhtim99
Ngày 10 Tháng 02 2019 , 00:46
Bạn tìm hiểu đi, background-size: cover; là thuộc tính giúp ảnh của bạn luôn fix được cái DIV với bất kỳ tỉ lệ ảnh nào. Đó chính là giải pháp

Hãy sống là chính mình, bình thường nhưng không tầm thường.
#190650 gửi bởi hoaquynhtim99
Ngày 10 Tháng 02 2019 , 00:56
Trong ví dụ mình đưa ra <img src="/assets/images/pix.gif" alt="Block Facebook Customer Chat"> đây chính là cái ảnh TRONG SUỐT quyết định cái kích thước của thẻ DIV

Ví dụ muốn tỉ lệ 3:4 thì bạn làm một cái ảnh trong suốt 3x4 px còn trong ví dụ kia ảnh https://nukeviet.vn/assets/images/pix.gif sẽ tạo ra cái DIV hình vuông

Còn cái div bao bên ngoài <div class="fix-img" style="background-image:url('/assets/store/images/2018_12/fb-customer-chat.png');"> đây chính là cái để hiển thị cái backgroud là những cái ảnh bạn đang muốn nó co giãn đúng tỉ lệ

Hãy sống là chính mình, bình thường nhưng không tầm thường.