当前位置:首页 > 行业动态 > 正文

html中如何设置图片的大小

在HTML中设置图片的大小,可以通过以下几种方法:

1、使用widthheight属性设置图片的宽度和高度。

<img src="example.jpg" width="300" height="200">

2、使用CSS样式设置图片的宽度和高度。

<style>
  .image {
    width: 300px;
    height: 200px;
  }
</style>
<img src="example.jpg" class="image">

3、使用百分比设置图片的宽度和高度。

<img src="example.jpg" width="50%" height="50%">

4、使用objectfit属性设置图片的缩放和裁剪方式。

<style>
  .image {
    width: 300px;
    height: 200px;
    objectfit: cover; /* 保持纵横比并覆盖整个容器 */
  }
</style>
<img src="example.jpg" class="image">

5、使用vwvhvminvmax单位设置图片的宽度和高度,这些单位分别表示视口宽度、视口高度、视口最小值和视口最大值。

<img src="example.jpg" width="50vw" height="50vh">
0