css使图片在父控件内自适应手机以及pc平板等多设备

我们去找到CSS的文件然后修改其属性

markdown img {
    display: block;/* 这意味着它可以与其他元素并排排列 */
    margin: 13px auto;/* 这为图像添加了上下左右的边距，但水平边距为"auto"，这使得图像在水平方向上居中。 */
    box-sizing: border-box;/* 此属性将元素的宽度和高度包括在其边框、边距和填充中。 */
    border: 0;/* 这移除了图像的边框。 */
    max-width: 100%;/* 图像的最大宽度为其父元素宽度的100% */
    max-height: 1220px;/* 图像的最大高度为1220像素。 */
    border-radius: 15px;/* 这给图像的边框添加了圆角，使其看起来更柔和。 */
    box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.3);/* 这给图像添加了一个阴影，使其看起来更有深度。 */
    width: 100%;  /* 将图像的宽度设置为100% */
    height: auto;/* 将图像的高度自动调整以保持纵横比，因此图像不会变形。这样，图像将自适应其容器的大小，并且始终保持正确的大小和比例。 */

将height修改成 auto将图像的高度自动调整以保持纵横比，因此图像不会变形。这样，图像将自适应其容器的大小，并且始终保持正确的大小和比例