高分辨率图像

Question

我的标志图像有一个高分辨率，但当我把它放在html代码，图像是模糊的，我没有把任何高度或宽度，我只是把图像。我希望当我把我的图像放到网站上时，图像保持高分辨率。

<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header-wp">
<div class="navbar-header">
<a class="cmn-toggle-switch cmn-toggle-switch__htx" href="javascript:void(0);" data-toggle="collapse" data-target="#navbar"><span>Menu mobile</span></a>
<div id="logo_home">
<h1><img style="margin-bottom: 10px;" src="img/logo.png" alt=""></h1>
</div>
<!--/top_nav-->
</div>
<!--/navbar-header-->
</div>
<!--/navbar-header-wp-->
<div class="collapse navbar-collapse navbar-right" id="navbar">
<ul class="nav navbar-nav">
<li class="dropdown">
<a style="color: #cc9933;" href="index.html">Início</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- /Nav -->
</header><!-- /Header --> ´´´

Answer 1

在这里了解CSSObject-fit属性:https://www.w3schools.com/css/css3_object-fit.asp，这将有助于停止或控制如何缩放/显示您的图像

Answer 2

你想要呈现的图像的大小精确分割原始图像的整数大小(以像素为单位)。

如果在你的CSS中width: 140px，那么使用实际宽度为140px或280px或420px等的图像