我在布局中有一张图片，当我调整窗口大小时，它的尺寸变小了，变得太小了。
我想让图像固定在它的位置，并防止它随着我缩小窗口而变得越来越小。
HTML
<div class="container-fluid" style="background-color: #333333;padding-left:30px;">
<div class="row">
<div class="col-md-12 outsidediv">
<!-- image -->
<div class="col-md-2 col-sm-2 col-xs-2 image" >
<img src="https://i.postimg.cc/50JVVSZF/checkk.png" style="max-width:100%;" alt="img">
</div>
<div class='col-md-2 col-sm-2 col-xs-2'>
<h2 style="font-size:2rem;color:#666666;">
<strong>
Some other Text alongside
</strong></h2>
</div>
</div>
</div>
</div>
CSS
.image{
display: flex;
flex-direction: column;
align-items: flex-start;
word-break:none;
color:white;
当你缩小窗口尺寸时，图像尺寸减小，如何解决这个问题？
最佳答案
您可以使用 CSS 设置静态大小:width: 93px;高度:96px；。您可以将它应用于“.image”类 div 或具体图像。这是图像标签上的内联 CSS:
.image{
display: flex;
flex-direction: column;
align-items: flex-start;
word-break:none;
color:white;
}<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
<div class="row">
<div class="col-md-12 outsidediv">
<!-- image -->
<div class="col-md-2 col-sm-2 col-xs-2 image" >
<img src="https://i.postimg.cc/50JVVSZF/checkk.png" style="width: 93px; height: 96px;" alt="img">
</div>
<div class='col-md-2 col-sm-2 col-xs-2'>
<h2 style="font-size:2rem;color:#666666;">
<strong>
Some other Text alongside
</strong></h2>
</div>
</div>
</div>
</body>
</html>关于html - 调整窗口大小时图像尺寸缩小，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54495752/