zoukankan      html  css  js  c++  java
  • 轮廓颜色 | outline-color (Basic User Interface)

  •   CSS 中文开发手册

    轮廓颜色 | outline-color (Basic User Interface) - CSS 中文开发手册

    outline-colorCSS属性设置元素的轮廓的颜色。一个轮廓线是围绕着一个元素在border外面画的线。

    outline定义轮廓的外观时使用简写属性通常更为方便。

    /* Keyword values */
    outline-color: invert;
    outline-color: red;
    
    /* Global values */
    outline-color: inherit;
    outline-color: initial;
    outline-color: unset;

    初始值

    invert, for browsers supporting it, currentColor for the other

    适用元素

    all elements

    是否是继承属性

    no

    适用媒体

    visual, interactive

    计算值

    For the keyword invert, the computed value is invert. For the color value, if the value is translucent, the computed value will be the rgba() corresponding one. If it isn't, it will be the rgb() corresponding one. The transparent keyword maps to rgba(0,0,0,0).

    Animation type

    a color

    正规顺序

    the unique non-ambiguous order defined by the formal grammar

    语法

    该outline-color属性被指定为下面列出的任何一个值。

    <color>轮廓的颜色被指定为<color>。invert为了确保轮廓可见,执行背景的颜色反转。请注意,浏览器不需要支持这个值,在这种情况下,它是无效的。

    正式语法

    <color> | invertwhere 
    <color> = <rgb()> | <rgba()> | <hsl()> | <hsla()> | <hex-color> | <named-color> | currentcolor | <deprecated-system-color>
    where 
    <rgb()> = rgb( [ [ <percentage>{3} | <number>{3} ] [ / <alpha-value> ]? ] | [ [ <percentage>#{3} | <number>#{3} ] , <alpha-value>? ] )
    <rgba()> = rgba( [ [ <percentage>{3} | <number>{3} ] [ / <alpha-value> ]? ] | [ [ <percentage>#{3} | <number>#{3} ] , <alpha-value>? ] )
    <hsl()> = hsl( [ <hue> <percentage> <percentage> [ / <alpha-value> ]? ] | [ <hue>, <percentage>, <percentage>, <alpha-value>? ] )
    <hsla()> = hsla( [ <hue> <percentage> <percentage> [ / <alpha-value> ]? ] | [ <hue>, <percentage>, <percentage>, <alpha-value>? ] )
    where 
    <alpha-value> = <number> | <percentage>
    <hue> = <number> | <angle>

    示例

    HTML

    <p>My outline is blue, as you can see.</p>

    CSS

    p {
      outline: 2px solid;      /* Set the outline width and style */
      outline-color: #0000FF;  /* Make the outline blue */
      margin: 5px;
    }

    规范

    Specification

    Status

    Comment

    CSS Basic User Interface Module Level 3The definition of 'outline-color' in that specification.

    Candidate Recommendation

    No change.

    CSS TransitionsThe definition of 'outline-color' in that specification.

    Working Draft

    Defines outline-color as animatable.

    CSS Level 2 (Revision 1)The definition of 'outline-color' in that specification.

    Recommendation

    Initial definition.

    浏览器兼容性

    Feature

    Chrome

    Edge

    Firefox (Gecko)

    Internet Explorer

    Opera

    Safari (WebKit)

    Basic support

    1.0

    (Yes)

    1.5 (1.8) 1

    8.0

    7.0

    1.2 (125)

    invert value

    No support

    ?

    No support 2

    8.0

    No support 3

    No support

    Feature

    Android

    Edge

    Firefox Mobile (Gecko)

    IE Phone

    Opera Mobile

    Safari Mobile

    Basic support

    ?

    (Yes)

    ?

    ?

    ?

    ?

  •   CSS 中文开发手册
    转载请保留页面地址:https://www.breakyizhan.com/css/32319.html
  • 相关阅读:
    关于SSIS中解密数据库字符串的方法
    Excel-计算年龄、工龄 datedif()
    Excel-满足指定条件并且包含数字的单元格数目,DCOUNT()
    Oracle-累加功能,累加百分比
    Oracle-一张表中增加计算某列值重复的次数列,并且把表中其他列也显示出来,或者在显示过程中做一些过滤
    mysql 实现某年单季度内的品牌TOPn销量在此年此单季度内销量占比
    mysql 分组统计、排序、取前N条记录解决方案
    mysql 除法运算保留小数的用法
    mysql 不等于 符号写法
    mysql 中@ 和 @@的区别
  • 原文地址:https://www.cnblogs.com/breakyizhan/p/13233413.html
Copyright © 2011-2022 走看看