<!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. jquery 计算输入的文本的utf-8字节长度

    jquery-2.1.1.min.js /*! jQuery v2.1.1 | (c) 2005, 2014 jQuery Foundation, Inc. | jquery.org/license ...

  2. android下使用smack需引入的包

    compile 'org.igniterealtime.smack:smack-android:4.2.0-alpha1' compile 'org.igniterealtime.smack:smac ...

  3. python3字符串格式化

    print('Hello World')print('%s',55)print('%6.2f' % 1.235)print('%06.2f' % 1.235)print('-%06.2f' % 1.2 ...

  4. leetcode：Happy Number

    要求:Write an algorithm to determine if a number is "happy". A happy number is a number defi ...

  5. 使用multimap创建重复键关联容器

    在“使用 <map> 库创建关联容器”一文中,我们讨论了标准库中的 map 关联容器.但那只是 map 容器的一部分.标准库还定义了一个 multimap 容器,它与 map 类似,所不同 ...

  6. 线程——QQ邮件发送

    一.造一个QQ邮件发送的窗体 二.开始编写关于邮件发送的代码,以及当点发送按钮的时候,给发送按钮单独造了一个新的线程.这样如果发送的附件太多的话,如果不给发送按钮造新的线程,便会卡住,但是如果给发送按 ...

  7. 多线程操作（循环往listbox中添加数据）

    一.先造一个窗体,其中就开始按钮,暂停按钮,以及listbox文本框 二.当点击开始的时候,数据会无限的往listbox中加,为了防止卡住和提升效率,便造了一个新的线程来执行开始操作 namespac ...

  8. laravel小抄

    原文地址:http://cheats.jesse-obrien.ca/ Artisan // Displays help for a given command php artisan --help ...

  9. 安卓WebView中接口隐患与手机挂马利用（远程命令执行）

    安卓应用存在安全漏洞,浏览网站打开链接即可中招.目前有白帽子提交漏洞表明目前安卓平台上的应用普遍存在一个安全漏洞,用户打开一个链接就可导致远程安装恶意应用甚至完全控制用户手机,目前微信,手机QQ,QV ...

  10. codeforces 431 B Shower Line【暴力】

    题意:给出五个人的编号,分别为 1 2 3 4 5,他们在排队, 最开始的时候,1和2可以交谈,3和4可以交谈 然后1走了之后,2和3交谈,4和5可以交谈 2走了之后,3和4可以交谈, 3走了之后,4 ...