如何使图像溢出高度响应?
我有时拥有的图像长度很高,使窗口滚动条可见.
所以我想让这些高度响应 – 使图像按比例缩小以适应窗口高度.
可能吗?
CSS,
html,body {
height: 100%;
margin: 0;
padding: 0 0;
border: 4px solid black;
}
.container-fluid {
height: 100%;
display: table;
width: 100%;
padding-right: 0;
padding-left: 0;
border: 4px solid blue;
}
.row-fluid {
height: 100%;
display: table-cell;
vertical-align: middle;
width: 100%;
border: 4px solid red;
}
.centering {
float: none;
margin: 0 auto;
}
HTML,
最佳答案
您可以在img上使用height:100%和vertical-align:top,在父元素上使用height:100vh
body,html {
margin: 0;
padding: 0;
}
div {
display: inline-block;
height: 100vh;
width: 100%;
text-align: center;
}
img {
height: 100%;
vertical-align: top;
}
原文链接:https://www.f2er.com/css/427566.html