CSS:CSS 轮廓(outline)
| ylbtech-CSS:CSS 轮廓(outline) |
| 1.返回顶部 |
CSS 轮廓(outline)
轮廓(outline)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用。
轮廓(outline)属性指定元素轮廓的样式、颜色和宽度。
轮廓(outline)实例
在元素周围画线
本例演示使用outline属性在元素周围画一条线。
设置轮廓的样式
本例演示如何设置轮廓的样式。
设置轮廓的颜色
本例演示如何设置轮廓的颜色。
设置轮廓的宽度
本例演示如何设置轮廓的宽度。
CSS 轮廓(outline)
轮廓(outline)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用。
CSS outline 属性规定元素轮廓的样式、颜色和宽度。

所有CSS 轮廓(outline)属性
"CSS" 列中的数字表示哪个CSS版本定义了该属性(CSS1 或者CSS2)。
| 属性 | 说明 | 值 | CSS |
|---|---|---|---|
| outline | 在一个声明中设置所有的轮廓属性 | outline-color outline-style outline-width inherit |
2 |
| outline-color | 设置轮廓的颜色 | color-name hex-number rgb-number invert inherit |
2 |
| outline-style | 设置轮廓的样式 | none dotted dashed solid double groove ridge inset outset inherit |
2 |
| outline-width | 设置轮廓的宽度 | thin medium thick length inherit |
2 |
| 2.返回顶部 |
| 3.返回顶部 |
| 4.返回顶部 |
| 5.返回顶部 |
| 6.返回顶部 |
![]() |
作者:ylbtech 出处:http://ylbtech.cnblogs.com/ 本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。 |
CSS:CSS 轮廓(outline)的更多相关文章
- css盒子模型、边框border、外边距margin、填充padding、轮廓outline
盒子模型:盒子默认的宽度为容器的宽度,也可以自省设定宽度,高度根据内容适应,也可以自行设定高度.min-height设定最小高度 一个盒子包括外边距.边框.内边距和实际内容 Margin(外边距):清 ...
- Bulma CSS - CSS类
Bulma CSS框架教程 Bulma CSS – 简介 Bulma CSS – 开始 Bulma CSS – CSS类 Bulma CSS – 模块化 Bulma CSS – 响应式 Bulma是一 ...
- CSS 不规则的轮廓-outline
大家好,我是半夏,一个刚刚开始写文的沙雕程序员.如果喜欢我的文章,可以关注 点赞 加我微信:frontendpicker,一起学习交流前端,成为更优秀的工程师-关注公众号:搞前端的半夏,了解更多前端知 ...
- CSS轮廓outline
http://www.cnblogs.com/xiaohuochai/p/5277416.html
- 边框(Border) 和 轮廓(Outline) 属性
border 复合属性.设置对象边框的特性. 标签定义及使用说明 如果上述值缺少一个没有关系,例如border:#FF0000;是允许的. 默认值: not specified 继承: no Java ...
- 简单了解css3轮廓outline
outline属性是用来设置一个或多个单独的轮廓属性的简写属性 , 例如 . 轮廓有下面几个属性: { outline-style: solid; outline-width: 10px; outli ...
- reset.css css重置公共样式
@charset "utf-8";/*Css Document*/ /*! * @名称:reset.css * @功能:1.重设浏览器默认样式 * 2.设置通用原子类 *//* 防 ...
- 【CSS3】透明度opacity与rgba()区别、光标cursor、display、轮廓outline与margin及border区别、em和rem区别
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 前端之CSS——CSS选择器
一.CSS介绍 为什么需要CSS(CSS的作用)? 在没有CSS之前,我们想要修改HTML元素的样式需要为每个HTML元素单独定义样式属性,当HTML内容非常多时,就会定义很多重复的样式属性,并且修改 ...
- 前端CSS css引入方式 css选择器 css选择器优先级
一. CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表 ...
随机推荐
- 2017 NOIp 初赛体验
很菜...我还是太蒟蒻了. d 老师太强了... 应该能有七十几分 初赛稳了 Update: 五十几分...
- videojs 播放无法通过URI确定格式的视频源(flv/mp4)
前言 前人坑我千百遍我待前人如初恋.最近公司开源节流搬机房,需要把原来的服务迁移,然后屁颠屁颠的把一个跑了几年没人管的视频网站(知道这个网站的人都走了)迁移到新的机房去. 结果跑起来发现原来里面同时存 ...
- kafka manager遇到的一些问题
1.启动后第一个报错如下: [error] k.m.a.c.BrokerViewCacheActor - Failed to get broker metrics for BrokerIdentity ...
- 【网络是怎么连接的】一、浏览器与HTTP协议
浏览器: 1.生成HTTP消息: 1).网址结构: http://user:password@www.glasscom.com:80/dir/file1.htm 2).HTTP服务基本思路: a).请 ...
- Java学习之构造函数
构造函数特点: 函数名和类名相同 没有返回值(不用定义返回值类型)作用: 对象初始化注意: 如果类没有定义构造函数时,系统会默认定义一个无参的构造函数 如果定义了构造函数,系统不会定义构造函 ...
- Mac-VScode
1) 安装 xcode. 打开App Store,搜索xcode,进行下载安装. 2)执行命令: xcode-select --install 3)安装VS Code https://code.vis ...
- 20. Cookie 和 Session
之前我们在Cookie 和Session是什么?已经说过Cookie 和Session,但是为了保证系列的完整性,我们决定重新说一遍,当然可能会有一些区别,建议先从Cookie 和Session是什么 ...
- Java学习第一次总结
在此之前我需要声明一下,我不载过多的评论知识点的简单与难易程度.写出来只是为了方便使用,现阶段追求的是实在.㈠①自动类型转换由低到高byte.short.char→int→long→flot→doub ...
- JavaScript之 ------ 函数(一般函数、动态函数、匿名函数)
JavaScript之 ------ 函数(一般函数.动态函数.匿名函数) 函数 一.一般函数 1.格式: function 函数名(形式参数...) { 执行语句: return 返回值: } 函数 ...
- oracle锁表和解锁
1.查看锁表清空 select * from v$session t1, v$locked_object t2 where t1.sid = t2.SESSION_ID; alter system k ...
