码迷,mamicode.com
首页 > 其他好文 > 详细

outline属性

时间:2015-06-06 10:32:33      阅读:608      评论:0      收藏:0      [点我收藏+]

标签:

outline(轮廓)用于设置元素周围的一条线,用于元素边框的外围,可起到突出元素的作用。

技术分享技术分享

 

outline属性所有浏览器都支持,如果规定了 !DOCTYPE,则 IE8 支持 outline 属性。

outline属性不会占用空间,也不一定是矩形。

outline的值的顺序:outline:outline-color,outline-style,outline-width;请始终在outline-color之前设置outline-style,元素只有先获得轮廓才能设置他的颜色。当设置为none时,则不显示轮廓线。

1、outline-color:invert(默认,执行颜色反转(逆向的颜色)。可使轮廓在不同的背景颜色中都是可见。)|颜色名称(red)|十六进制(#fff)|rgb(rgb(255,0,0))|inherit;

2、outline-style:值如下:

描述
none 默认。定义无轮廓。
dotted 定义点状的轮廓。
dashed 定义虚线轮廓。
solid 定义实线轮廓。
double 定义双线轮廓。双线的宽度等同于 outline-width 的值。
groove 定义 3D 凹槽轮廓。此效果取决于 outline-color 值。
ridge 定义 3D 凸槽轮廓。此效果取决于 outline-color 值。
inset 定义 3D 凹边轮廓。此效果取决于 outline-color 值。
outset 定义 3D 凸边轮廓。此效果取决于 outline-color 值。
inherit 规定应该从父元素继承轮廓样式的设置。

效果如下:

技术分享技术分享

3.outline-width:

值描述thin规定细轮廓。medium默认。规定中等的轮廓。thick规定粗的轮廓。length允许您规定轮廓粗细的值(如5px)。inherit规定应该从父元素继承轮廓宽度的设置。

outline属性

标签:

原文地址:http://www.cnblogs.com/0808bing/p/4556169.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!