/* 将元素向左浮动 */
.float-left {
float: left;
}
/* 将元素向右浮动 */
.float-right {
float: right;
}浮动可以让元素脱离文本流并移动至指定位置。左浮动元素会对页面布局的影响比较大，它会影响其右侧的所有元素及其包含块的宽度。右浮动元素同样也会影响布局，只不过影响的是左侧的元素。
浮动元素通常设置宽度，否则会把元素撑满整个父容器。不过有时候也需要为了自适应而省略宽度，然后使用clearfix来修正浮动影响。
/* 清除浮动影响 */
.clearfix::after {
content: "";
display: table;
clear: both;
}浮动元素的展现方式取决于父元素和兄弟元素的布局。如果所在容器高度不够，浮动元素将溢出容器显示在其他元素之上。此时一种解决方案是使用overflow: auto来强制父元素包含浮动元素。
除了浮动元素之外，CSS 中还有一种常见的元素浮起技术：阴影。使用box-shadow属性，可以为元素添加一层阴影，从而使其和其他元素区别开来。
/* 添加阴影 */
.shadow {
box-shadow: 2px 2px 2px #ccc;
}通过组合使用浮动和阴影技术，可以创造出更加鲜明的页面效果。同时，需要注意掌握好浮动元素的布局规则，以免产生无法预期的效果。