CSS3裁剪标签元素技巧

CSS3新增的clip属性可用于裁剪元素，其值按上、右、下、左顺序设定，通过四个方向的数值确定裁剪区域。以下通过具体实例演示该属性的使用方法与操作步骤。

1、 双击启动HBuilder编辑工具，创建新静态页面，选择默认H5模板，操作界面所示。

2、 在body标签内添加一个div元素，并将其id属性设置为div，具体效果所示。

3、 第三步，通过CSS的ID选择器对div元素进行样式设置，包括宽度、高度、定位方式及背景属性等，具体效果所示。

4、 保存代码文件后在浏览器中预览，可见字体已居中显示，具体效果所示。

5、 在 color 属性下方新增 clip 属性，并按图示设置其四个参数值。

6、 保存代码后，可见div元素区域已变为矩形裁剪效果，所示。