outline属性的设置和作用简述

又起风了

于 2015-10-29 18:28:59 发布

阅读量4.3k

点赞数 3

分类专栏： css 文章标签： css outline 文本框

本文链接：https://blog.csdn.net/pan_xi_yi/article/details/49495179

版权

css 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

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

注释：轮廓线不会占据空间，也不一定是矩形。
outline 简写属性在一个声明中设置所有的轮廓属性。
简单说，当我们直接单击文本框里面是，外部会出现一个高亮的效果，对，这个就是outline；如果要设置一个椭圆形的文本框时outline 就显得多余了，可以设置outline：none；设置轮廓线为none，另外也可以outline-width:0px;
上代码：

<!DOCTYPE html>
<html lang="en-us">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>-_-</title>
</head>
<body>
用户名：<input type="text" style="width:180px;height:25px;border-radius:15px;outline:none;" placeholder="请输入你的用户名">
</body>
</html>