Beginner Tutorials

轻松上手,快乐学习!

HTML CSS JAVASCRIPT SQL PYTHON MYSQL PHP GIT 问答工具导航更多  实例参考

×

                    HTML and CSS
                    学习 HTML
                    学习 CSS
                

                    后端
                    学习 Python
                

                    数据库
                    学习 MySQL
                    学习 SQL
                

                    其它
                    学习 Git
                    问答
                    工具
        	    笔记
                

×

HTML

HTML Tag 参数 HTML Event 参考 HTML Color 参考 HTML Attribute 参考

×

Exercises

HTML Exercises CSS Exercises JavaScript Exercises SQL Exercises Python Exercises

❮ 上一页下一页 ❯

CSS outline-color 属性

实例

设置轮廓的颜色：

div {outline-color: coral;}

亲自试一试 »

下面有更多实例。

定义和用法

outline （轮廓）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。

outline-color 属性指定轮廓的颜色。

注释: 始终在 outline-color 属性之前声明 outline-style 属性。在更改元素的颜色之前，元素必须具有轮廓。

默认值:	invert
继承性:	no
支持动画:	yes, 请参阅单独的属性. 阅读有关动画的信息测试一下
版本:	CSS2
JavaScript 语法:	object.style.outlineColor="#FF0000" 测试一下

提示和注释

注释: 轮廓与 borders 边框不同！ 与边框不同，轮廓绘制在元素边框之外，并且可能与其他内容重叠。此外，轮廓不是元素尺寸的一部分；元素的总宽度和高度不受轮廓宽度的影响。

浏览器支持

表中的数字表示支持该属性的第一个浏览器版本。

属性
outline-color	1.0	8.0	1.5	1.2	7.0

语法

outline-color: invert|color|initial|inherit;

属性值

值	描述	试一试
invert	默认。执行颜色反转（逆向的颜色）。可使轮廓在不同的背景颜色中都是可见。	亲自试一试 »
color	指定轮廓颜色。在 CSS 颜色值寻找颜色值的完整列表。	亲自试一试 »
initial	将此属性设置为其默认值。请参阅 initial	亲自试一试 »
inherit	从其父元素继承此属性。请参阅 inherit

更多实例

实例

使用十六进制值设置轮廓的颜色：

div {outline-color: #92a8d1;}

亲自试一试 »

实例

使用 RGB 值设置轮廓颜色：

div {outline-color: rgb(201, 76, 76);}

亲自试一试 »

实例

使用 RGBA 值设置轮廓颜色：

div {outline-color: rgba(201, 76, 76, 0.3);}

亲自试一试 »

实例

使用 HSL 值设置轮廓颜色：

div {outline-color: hsl(89, 43%, 51%);}

亲自试一试 »

实例

使用 HSLA 值设置轮廓颜色：

div {outline-color: hsla(89, 43%, 51%, 0.3);}

亲自试一试 »

相关页面

CSS 教程: CSS Outline

CSS 参考手册: outline 属性

HTML DOM 参考手册: outlineColor 属性

❮ 上一页下一页 ❯

颜色选择器

colorpicker

常用工具

彩色渐变
 JSON在线
 时间戳转换
 常用网站
 SQL
EMOJI和符号
 Read More »

                教程TOP
                HTML 教程

                CSS 教程

                JavaScript 教程

                Python 教程

                参考TOP
                HTML 参考

                CSS 参考

                JavaScript 参考

                SQL 参考

                实例TOP
                HTML 实例

                CSS 实例

                JavaScript 实例

                Python 实例

                站点信息
                隐私政策

                联系合作

                免责申明

                关于我们

新手教程所有内容，包括文字、图片、音频、视频、软件、程序、以及网页版式设计等均在网上搜集。
新手教程提供的内容仅用于个人学习、研究或欣赏。我们不保证内容的正确性。通过使用本站内容随之而来的风险与本站无关
访问者可将本网站提供的内容或服务用于个人学习、研究或欣赏，以及其他非商业性或非盈利性用途，但同时应遵守著作权法及其他相关法律的规定，不得侵犯本网站及相关权利人的合法权利。
本网站内容原作者如不愿意在本网站刊登内容，请及时通知本站，予以删除。
Copyright © 2019 新手教程 begtut.com All Rights Reserved. 皖ICP备19011202号