outline 和 border的区别:

  outline不占据文档空间,border占据文档空间。

  outline无法单独设置上下左右,只要设置outline,必须所有的边都设置;border可以设置任意一个方向时候有border。

outline的兼容性问题:

  IE8一下不支持outline。

由于outline不占据文档空间的特性,在很多情况下很好用。但它最大的限制就是无法单独设置某个方向的边。并且存在兼容性问题。

outline的兼容性及使用限制的更多相关文章

  1. 移动端 几个css3属性的练习

    转行做前端,上班有一个星期了,什么都不懂,今天学习了几个新的css3属性,记录下来. 注:所有的测试均是在chrome上手机模式测试,与真实的手机环境可能有误差 1:-webkit-tap-heigh ...

  2. 浏览器兼容性问题——IE不支持却很实用的CSS属性Outline和Child

    1. Outline(适用范围:鼠标悬浮hover加外边框) 我们在布局的时候,常常会因为添加边框border影响宽高的布局. 那么,outline是完美的替代品,因为它可以在不影响文档流的情况下呈现 ...

  3. 利用CSS3实现圆角的outline效果的教程

    一.首先,outline是个很牛的东西1. border近亲outline和border是近亲,为什么这么讲呢?首先,都是给元素外面套框框的:其次,支持的属性值几乎都是一样的,例如,outline-s ...

  4. 浏览器兼容性之Css篇

    本文与上一篇随笔<浏览器兼容性之Javascript篇>有一定关联,下来我会继续不断总结,旨在解决浏览器兼容性,对遇到类似问题的同仁有所帮助,如有更多解决浏览器兼容性的案例还望大家分享一起 ...

  5. IE11的CSS兼容性问题

    最近测试给了我一大堆BUG,一瞅发现全是IE11的.吐槽一下这个浏览器真的比较特立独行.很多默认的样式跟别的浏览器不同,而且最明显的一点应该是padding左右内边距往往比别的浏览器大了一倍.但是当需 ...

  6. 对浏览器css兼容性的学习理解及问题解决汇总

    一.从浏览器内核的角度 来看,浏览器兼容性问题可分为以下三类: 1. 渲染相关:和样式相关的问题,即体现在布局效果上的问题. 2. 脚本相关:和脚本相关的问题,包括JavaScript和DOM.BOM ...

  7. CSS如何实现圆角的outline效果?

    一.首先,outline是个很牛逼的东西 温故而知鑫,10年的时候写过一篇可用性方面的文章:“页面可用性之outline轮廓外框的一些研究”,还算挺有用的:3年之后,也就是13年,介绍了个没什么使用价 ...

  8. 【web前端开发】浏览器兼容性处理

    1.居中问题div里的内容,IE默认为居中,而FF默认为左对齐,可以尝试增加代码margin: 0 auto;2.高度问题两上下排列或嵌套的div,上面的div设置高度(height),如果div里的 ...

  9. css之outline实现圆角效果

    对,你没有看错,outline也可以实现圆角,不过请先读完自然会知道结果: ============================================================== ...

随机推荐

  1. ExtJs Ext.data.Model 学习笔记

    Using a Proxy Ext.define('User', { extend: 'Ext.data.Model', fields: ['id', 'name', 'email'], proxy: ...

  2. Yarn NodeManager restart

    一.介绍默认Yarn NodeManager重启后会断开所有当前正在运行的container的状态,这意味着重启后需要重新启动container进程,该特性的作用就是把NM的状态临时保存到本地,重启后 ...

  3. scala实现彩票算法

    scala实现彩票算法 (1)具体实现代码如下: package hw1 import scala.util.control._ /** * @author BIGDATA */ object Cp ...

  4. Yii CDbCriteria 常用方法

    一.一个sql拼装的情况 $criteria = new CDbCriteria; //函数方式 $criteria->addCondition("id=1"); //查询条 ...

  5. Hibernate- 动态实例查询

    什么是动态实例查询: 就是将查询出的单一列的字段,重新封装成对象,如果不适用特殊方法,会返回Object对象数组. 01.搭建环境 02.动态实例查询 需要使用相应的构造方法: public Book ...

  6. nodejs系列笔记02---模块路径解析

    模块路径解析规则 参考这篇博客 我们已经知道,require函数支持斜杠(/)或盘符(C:)开头的绝对路径,也支持./开头的相对路径.但这两种路径在模块之间建立了强耦合关系,一旦某个模块文件的存放位置 ...

  7. axis client error Bad envelope tag: definitions

    http://blog.csdn.net/lifuxiangcaohui/article/details/8090503 ——————————————————————————————————————— ...

  8. ubuntu下配置java环境

    配置JDK环境 下载 登录oracle的网站去下载JDK7 http://www.oracle.com/technetwork/java/javase/downloads/jdk7-downloads ...

  9. JAVA虚拟机、Dalvik虚拟机和ART虚拟机简要对比

    1.什么是JVM?   JVM本质上就是一个软件,是计算机硬件的一层软件抽象,在这之上才能够运行Java程序,JAVA在编译后会生成类似于汇编语言的JVM字节码,与C语言编译后产生的汇编语言不同的是, ...

  10. e577. Enabling Antialiasing

    // See e575 The Quintessential Drawing Program public void paint(Graphics g) { // Retrieve the graph ...