您现在的位置是：网站首页> 编程资料编程资料

深入浅析border和outline区别使用CSS的border属性构建变形边框的方法总结border-radius以外的CSS圆角边框制作方法实例讲解CSS3中的border-radius属性详解CSS3中border-image的使用CSS3使用border-radius属性制作圆角使用CSS实现outline切换的动画效果请保留超链接的outline属性去掉点击链接时周围的虚线框outline属性 CSS教程:text-indent隐藏文字出现虚线框outline-CSS教程-网页制作-网页

2021-09-05 924人已围观

简介这篇文章主要介绍了深入浅析border和outline区别的相关资料,需要的朋友可以参考下

border支持box-sizing: border-box，当有边距时，是新增了边框后在按照以前的边距处理

outline不支持box-sizing: border-box;先处理边距，后加轮廓，有点类似缩放（transform: scale(1.2);）无论轮廓大小样式不影响布局。

outline 与 border 的区别小结

border 可应用于几乎所有有形的html元素，而 outline 是针对链接、表单控件和ImageMap等元素设计。从而另一个区别也可以推理出，那就是： outline 的效果将随元素的 focus 而自动出现，相应的由 blur 而自动消失。这些都是浏览器的默认行为，无需JavaScript配合CSS来控制。

上一篇：CSS3中Transition动画属性用法详解 CSS3中Transform动画属性用法详解 CSS3中Animation动画属性用法详解 CSS3中的Transition过度与Animation动画属性使用要点深入理解css属性的选择对动画性能的影响jQuery利用CSS3的keyframes属性实现飞翔的小鸟动画特效CSS3 steps属性制作僵尸行Sprite动画特效源码css动画属性使用及实例代码(transition/transform/animation)

下一篇：使用CSS的table-cell属性实现左图右文的排版方法详解CSS中使用table-cell法来达到居中效果CSS：Table-cell属性的妙用让div也能享受table定位的好处关于CSS中的display:table-cell使用技巧的几种应用

您现在的位置是：网站首页> 编程资料编程资料

相关内容

点击排行

本栏推荐

猜你喜欢