css综合属性 |css 图片自动换行排列

/* border 综合属性 */
div {
border: 2px solid blue;
/* 将网格线变为实线边框，边框宽度为 2 像素，颜色为蓝色 */
}
/* margin 综合属性 */
p {
margin: 20px 10px;
/* 上下边距为 20 像素，左右边距为 10 像素 */
}
/* padding 综合属性 */
nav {
padding: 0 20px;
/* 左右内边距为 20 像素，上下内边距为 0 */
}
/* font 综合属性 */
h1 {
font: italic bold 24px/1.5 Arial, sans-serif;
/* 字体为 Arial 或 sans-serif, 斜体，粗体，大小为 24 像素，1.5 倍行高 */
}

以上代码演示了 border、margin、padding、font 这几种常见综合属性的用法。

值得注意的是，在使用综合属性时，各个值的顺序也有规则。例如，font 属性中的各值的顺序应该是：样式，字重，大小/行高，字体，后面若有字体的话。而 margin 和 padding 属性的顺序分别为：上、右、下、左。

综合属性的使用能够使代码更简洁，减少样式冗余，提高效率。同时，如果需要对单个值进行修改，也可以使用细化属性来进行设置。

/* 细化 margin 属性 */
p {
margin-top: 20px;
margin-rightt: 10px;
margin-bottom: 30px;
margin-left: 10px;
}

以上就是综合属性的基本用法和注意事项。在编写 CSS 样式时，大家可以根据需要灵活使用，以便更好地掌控页面外观效果。