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?
Apakah yang menyebabkan skrin komputer menjadi kuning?
kekunci pintasan skrin kunci tingkap
Tutorial untuk pendatang baru di Ouyi
Pengenalan kepada lokasi panel kawalan win10
penggunaan fungsi timestampdiff
Apakah perbezaan antara lulus dengan nilai dan lulus dengan rujukan dalam java
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
