css图片等比缩小样式 |css时间选择控件

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

以上是最基本的CSS样式，将所有图片的最大宽度设为100%，高度自适应。这样可以确保当图片尺寸超过页面宽度时，图片不会出现溢出现象，而是按比例缩小至适合页面显示。

有时候，大家可能需要对图片进行一些特殊处理，比如让图片始终显示为正方形：

.square-img {
width: 100%;
padding-bottom: 100%; /*设置padding的百分比是根据宽度计算*/
background-repeat: no-repeat; 
background-size: cover;
background-position: center center;
}

以上代码中，大家将宽度设置为100%，高度设为0，并为图片添加一个padding-bottom百分比值。由于padding的百分比是根据元素宽度进行计算的，因此这样做可以确保图片宽高比始终为1:1。

为了让图片居中显示，大家可以使用background-repeat和background-position来调整其位置，而background-size则可以确保图片始终占用整个div的空间。

以上就是CSS中图片等比缩小的一些技巧，希望对大家有所帮助。