css中图片紧贴上一盒子 |css的图片的圆角

/** CSS 中的盒子 **/
.box {
background-image: url('image.png');
background-repeat: no-repeat;
background-position: center center;
width: 300px;
height: 200px;
border: 1px solid #ccc;
}
/** 图片紧贴上一盒子 **/
.box img {
display: block;
margin: 0 auto;
padding: 0;
max-width: 100%;
max-height: 100%;
}

让图片紧贴上一盒子的方法其实很简单，大家只需要给图片添加下面这些 CSS 属性：

• display: block;把图片设置成块级元素，使其与其他元素分成两行。
• margin: 0 auto;把图片水平居中，让其与盒子左右两侧紧贴。
• padding: 0;让图片与盒子的内边距为 0，使其上下两侧紧贴。
• max-width: 100%;让图片的宽度最大不能超过盒子的宽度。
• max-height: 100%;让图片的高度最大不能超过盒子的高度。

这样，大家就可以在 CSS 中轻松地让图片紧贴上一盒子了。如果你有其他的 CSS 相关问题，欢迎留言与偶交流。