<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
.box {
width: 500px;
height: 300px;
outline: dashed #0082cb;
border: 1px solid red;
}
</style> </head>
<body> <div class="box">
ontline-style:dashed:定义点状的轮廓;
solid
double
groove:定义3D凹槽轮廓,此效果取决于outline-width的值
ridge:定义3D凹槽轮廓,此效果取决于outline-color值
inset:定义3D凹边轮廓,此效果取决于outline-color的值;
outset:定义3D凹边轮廓,此效果取决于outline-color的值;
inherit:继承;
ooutline-color;outline-width;
</div>
</body>
</html>

  

ontline-style:dashed:定义点状的轮廓; solid double groove:定义3D凹槽轮廓,此效果取决于outline-width的值 ridge:定义3D凹槽轮廓,此效果取决于outline-color值 inset:定义3D凹边轮廓,此效果取决于outline-color的值; outset:定义3D凹边轮廓,此效果取决于outline-color的值; inherit:继承; ooutline-color;outline-width;

css:outline的更多相关文章

  1. CSS3 border-radius 属性和CSS outline 属性

    CSS3 border-radius 属性 border-radius 属性是一个简写属性,用于设置四个 border-*-radius 属性. 提示:该属性允许为元素添加圆角边框! 注释:按此顺序设 ...

  2. CSS Outline(轮廓)

    CSS Outline(轮廓) 一.CSS 轮廓(outline) 轮廓(outline)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用. CSS outline 属性规定元素轮廓 ...

  3. css outline实践研究

    outline具有和border很相似的属性,但多少又有些区别,就是因为这些区别才让它闪闪发光,先目睹一下. <style> div{ width:100px; height:100px; ...

  4. css -- outline轮廓

    outline:#00ff00 solid thick; 边框参数: 样式: none:默认,无轮廓 dotted:点状轮廓 dashed:虚线轮廓 solid:实现轮廓 double:双线轮廓,宽度 ...

  5. css outline属性

    outline属性在一个html element的周围画出一条线来,位于边框的外围,起到突出元素的作用.轮廓线不占据任何布局空间,也不一定非要是矩形. p { outline:#00FF00 dott ...

  6. CSS 笔记三(Tables/Box Model/Outline)

    CSS Tables border border: border-width border-style border-color|initial|inherit; border-width borde ...

  7. CSS魔法堂:那个被我们忽略的outline

    前言  在CSS魔法堂:改变单选框颜色就这么吹毛求疵!中我们要模拟原生单选框通过Tab键获得焦点的效果,这里涉及到一个常常被忽略的属性--outline,由于之前对其印象确实有些模糊,于是本文打算对其 ...

  8. CSS:CSS 轮廓(outline)

    ylbtech-CSS:CSS 轮廓(outline) 1.返回顶部 1. CSS 轮廓(outline) 轮廓(outline)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用. ...

  9. CSS魔法堂:Box-Shadow没那么简单啦:)

    前言  说起box-shadow那第一个想法当然就是用来实现阴影,其实它还能用于实现其他好玩的效果的,本篇就打算说说box-shadow的那些事. 二话不说看效果 3D小球 <style typ ...

随机推荐

  1. Linux实用命令

    0. 基本命令 1. 压缩 解压 tar -zcvf a.tar.gz a #把a压缩成a.tar.gz tar -zxvf a.tar.gz #把a.tar.gz解压成a 2. vim小结 2.1 ...

  2. 你猜……你再猜

    『男』:你喜欢我吗? 『女』:你猜. 『男』:喜欢. 『女』:你再猜. 『男』:--

  3. 【Android】MTK Android 编译命令

    命令格式:./maketek [option] [project] [action] [modules] Option: -t ,-tee :输出log信息到当前终端 -o , -opt=-- : 编 ...

  4. PDO数据库

    <?php //定义数据源$dsn = "mysql:dbname=testa;host=localhost"; //造PDO对象$pdo = new PDO($dsn,&q ...

  5. 齐次坐标概念&&透视投影变换推导

    http://daehgib.blog.163.com/blog/static/1861071422011579551134/ 透视投影是3D固定流水线的重要组成部分,是将相机空间中的点从视锥体(fr ...

  6. Oracle数据库之二

    SELECT查询 函数分为: 单行函数 -- 一条记录进入,一条记录输出 多行函数(分组函数)-- 多条记录进入,按组输出 单行函数: select id,first_name,nvl(commiss ...

  7. UVa 1442 (线性扫描) Cave

    对于一个水坑,水平面肯定是相等的.(废话,不然为什么叫水ping面) 因为水面不能碰到天花板,所以将水面向两边延伸要么碰到墙壁要么延伸到洞穴外面去. 设h(i)表示向左延伸不会碰到天花板的最高水平面, ...

  8. 配置域名服务器报错named[822]: dns_rdata_fromtext /etc/bind/db.asertest.com mail not a valid number

    问题描述: 为了配置邮件服务器,更改了相关域名,改完后,重启bind9报错 Mar 17 14:39:39 DnsServer2 named[822]: dns_rdata_fromtext: /et ...

  9. PHP全栈工程师学习大纲

    一.高性能网站开发功力提升 时间 标题 内容概要 2015-12-28 开学典礼以及工程师成长路线图 工程师成长的发展路径图.三个阶段,在各个阶段需要提升自己的地方,从技术上也讲了一些提高分析代码的工 ...

  10. chrome浏览器下禁制 textarea改变大小; Jquery的textareaCounter插件控制textarea输入的字符数量

    给  textarea 添加一个css 样式即可 resize: none;   用Jquery的插件控制textarea输入的字符数量 一:引用Jquery脚本,并引入 textareaCounte ...