CSS代码民工 |css3做相片边框

/* 下面是一段被称为“CSS清除浮动”的常见代码 */
.clearfix:after {
content: "";
display: block;
clear: both;
}

清除浮动就是CSS代码民工经常兼顾的部分。由于子元素浮动导致父元素高度塌陷的问题，需要使用该代码解决。将它应用于浮动元素的父元素，即可轻松地解决该问题。

/* 下面是一个栅格布局系统的示例代码 */
.row::after {
content: "";
display: table;
clear: both;
}
.col {
float: left;
}
.col-1 {
width: 8.33333%;
}
.col-2 {
width: 16.66667%;
}
.col-3 {
width: 25%;
}
.col-4 {
width: 33.33333%;
}
.col-5 {
width: 41.66667%;
}
.col-6 {
width: 50%;
}
.col-7 {
width: 58.33333%;
}
.col-8 {
width: 66.66667%;
}
.col-9 {
width: 75%;
}
.col-10 {
width: 83.33333%;
}
.col-11 {
width: 91.66667%;
}
.col-12 {
width: 100%;
}

栅格布局系统可以帮助大家快速、方便地进行页面布局，也是CSS代码民工们经常使用的重要工具。实现该布局的核心就是将页面宽度分成12等份，再将每个元素对应的宽度设置为这12等份中的一部分。

以上是CSS代码民工们工作中经常使用的两个代码示例。当然，还有许多其他的技巧和代码需要掌握和运用。但无论是哪个领域，都需要有人默默工作和付出，让整个团队、整个行业不断前进。