基于OpenLayers的WebGIS程序二次开发实例教程
34507 人在学
专题课程
这是CSS3的又一重大突破。早在CSS诞生之前，我们就可以通过background属性为元素设置背景图片填充，但就迟迟不支持到边框上。那么，要用图片填充边框的话，大家就想到了一个很巧妙的方法——两个元素相互重叠或者嵌套，然后叠在上面的或者内层的元素尺寸小点，外层填充背景图片，然后内层用纯色盖一下，就得到一个图片填充的边框了。
实现到html上，就是如下代码:
效果如下图所示
然后我们给in-border设置一下白色背景。
边框背景就出来了
为了这么一个小功能搞两层嵌套，网页复杂了必然会为页面增加不少负担。所以，CSS3为民请命，优雅地解决了这一问题。
这时候你就会发现，不用嵌套，也能做出图片填充的边框来。
效果如下图所示
实际上，border-image还有更精确的参数可以控制。大多数情况下，我们会使用这种类型的图片来为元素添加图片边框。
但作为新功能介绍，小编就不再详细演示这类图片的参数控制了。都说“师傅领进门，修行靠个人”，相信通过对border-image的简单介绍，大家都可以体会到CSS3新功能的魅力了。
粤公网安备44010602001432号