css3 outline为div元素添加轮廓线
有时为了样式的更加美观，可适当的为div添加轮廓线。可通过outline属性来实现。
outline 包含以下几个属性值；
outline-width:轮廓线的粗细。
此属性值包含4个参数：thin，medium,thick,length
thin:定义细轮廓；
medium:定义中型轮廓；
thick:定义粗型轮廓。
length:可以指定轮廓线的粗细，注，此值不能为负值；
outline-style：轮廓线的样式。
此属性常用参数：
none:设置为none时，轮廓将不显示.
dotted:点轮廓线,
dashed:虚线轮廓线,
solid:实线轮廓线。
outline-color:轮廓线的颜色
此属性的参数：
颜色名称:(red);
rgb颜色值:rgb(255,255,255);
十六进制颜色值:如：#ff0000;
outline-offset:轮廓线与容器的偏移值。此值为负时，将向容器内显示轮廓线。
示例代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>无标题文档</title>
<style>
.aixuexi{
padding:20px;
position:fixed;
top:100px;
left:300px;
border:2px dashed #000;
width:100px;
height:100px;
line-height:100px;
background:#abcdef;
outline-width:10px;
outline-style:solid;
outline-color:#99FF00;
outline-offset:20px;
}
</style>
</head>
<body>
<div class="aixuexi"><a href="#">hello world</a></div>
</body>
</html>Atas ialah kandungan terperinci css3中关于outline如何为div元素添加轮廓线的实例. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
tutorial css3
Apakah sifat kecerunan css3?
Perbezaan antara mac air dan pro
Apakah keperluan untuk siaran langsung Douyin?
Harga terkini pasaran eth
Bagaimana untuk menetapkan ppt skrin lebar
Perbezaan antara front-end dan back-end
Bagaimana untuk menyelesaikan masalah yang localhost tidak boleh dibuka
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
