关于css3彩色的边框阴影事例分享

       页面元素的边框是我们常见的属性,无非就是一些线条的节制用来区分区域,可是跟着慢慢的进修,小编发现本身仍是太年青了...,一个简单可是灿艳区域朋分就是可以经由过程边框暗影结果来实现的;

关于css3彩色的边框阴影事例分享

文章插图

需要这些哦
电脑
Sublime text 2
方式/
1起首我们先写一个简单的静态页面,里面就放置一个 div , 之后用来演示,若何节制 div 的边框暗影,达到灿艳的结果;

关于css3彩色的边框阴影事例分享

文章插图

关于css3彩色的边框阴影事例分享

文章插图

2起首,我们先把  div  的样式节制一下;
【关于css3彩色的边框阴影事例分享】width ,height 节制 宽和高;
margin 节制外边距,趁便将 div 放置到页面中心;
border,让没有内容的 div 闪现;

关于css3彩色的边框阴影事例分享

文章插图

3如图一,我们可以看到边框的边角是圆弧的,这里的样式也是由别的的属性节制的;
border——radius:;

关于css3彩色的边框阴影事例分享

文章插图

关于css3彩色的边框阴影事例分享

文章插图

4然后我们先简单的节制一边的暗影结果,暗影颜色设为黄色;
box-shadow:;   

    推荐阅读