css如何让图片正常显示

CSS是网页设计中必不可少的一部分，可以通过CSS样式表来设置图片的展示效果。下面介绍CSS如何让图片正常显示。

首先我们需要了解几个CSS属性：

  img {
    display: block; /*将图片转化为块级元素*/
    max-width: 100%; /*限制图片的最大宽度为父元素宽度*/
    height: auto; /*高度自动调整*/
  }

其中，display:block; 是将元素转换成块级元素，使得图片可以单独占一行，而不会跟其他元素挤在一起，达到更好的布局效果。

max-width: 100%;是限制图片的最大宽度为父元素的宽度，父元素宽度少于图片宽度时，图片就会自动缩小，避免页面显示不完整和滚动条横向出现的问题。

height:auto; 则可以使图片的高度自适应，避免拉伸变形或裁剪的情况出现，保证图片显示的纵横比例。

完整代码如下：

  img {
    display: block;
    max-width: 100%;
    height: auto;
  }

通过上述CSS样式，可以保证图片在网页中被正常显示，不影响页面的美观性和用户体验。