好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

CSS轮廓outline_html/css_WEB-ITnose

× 目录 [1]轮廓样式 [2]轮廓宽度 [3]轮廓颜色 [4]轮廓偏移 [5]复合属性 [6]常见应用

前面的话

  应用于: 所有元素

  继承性: 无

轮廓

  轮廓outline类似于边框样式的border属性,允许一次完成轮廓样式、宽度和颜色的设置。由于给定轮廓必须采用某种统一的样式、宽度和颜色,所以outline是关于轮廓的唯一简写属性。对于轮廓没有诸如outline-top或outline-right之类的属性

  [注意]outline中并没有包括outline-offset,需要对outline-offset进行单独设置

outline

  值: [ || || ] | inherit

  初始值: 无

  应用于: 所有元素

  继承性: 无

应用

  由于轮廓outline不影响元素的盒模型大小,不影响页面布局,所以可以用outline模仿border边框效果。但如果是圆角边框就不是那么好办了。

  firefox浏览器支持私有属性-moz-outline-radius来设置轮廓圆角。该属性对应的js写法是MozOutlineRadius

  对于其他浏览器,我们可以使用其他属性实现类似效果。box-shadow与border-radius属性一脉相承,也就是说如果border-radius是圆角,则box-shadow的投影也是圆角

测试内容

查看更多关于CSS轮廓outline_html/css_WEB-ITnose的详细内容...

  阅读:30次