`
mabusyao
  • 浏览: 253363 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

Border vs outline

    博客分类:
  • UI
阅读更多
今天遇到一个非常之变态的问题。

我们的页面上有一个Dojo控件,onfocus的时候,本应出现的虚线框消失了。而且只有IE7下才有这个问题,IE8加FF都运转正常。

找啊找,找啊找,也没有找到原因。 最后请教一位高人,找出了原因:

outline: IE下不可用,元素周围的边框,不占空间。

border: IE FF都可用,元素周围的边框,占空间。

Dojo的onfoculLabel这个class是使用outline来做边框的,所以某些情况下,就不会显示。

只需要简单的覆写这个class就ok啦:
.tundra .dijitFocusedLabel {
	border-style: dotted;
	border-color: #666666;
	border-width: 1px;
}


没想到啊,折磨了我这么久的问题。

IE再这么折腾下去可不是件好事,至少目前看来,还是遵循标准比较有前途。
分享到:
评论

相关推荐

    深入浅析border和outline区别

    在网页设计中,`border` 和 `outline` 都是用来定义元素边缘的样式,但它们之间存在着明显的区别。本文将深入探讨这两个属性的差异,并帮助开发者更好地理解和运用它们。 首先,`border` 是一个内置于元素盒模型的...

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

    border近亲outline和border是近亲,为什么这么讲呢?首先,都是给元素外面套框框的;其次,支持的属性值几乎都是一样的,例如,outline-style和border-style值dotted, dashed, solid, …之类的,一些语法也几乎一样...

    CSS轮廓outline的具体使用

    在CSS中,轮廓(outline)是一种非几何的装饰性元素,用于强调或区分网页上的某个特定元素。与边框(border)不同,轮廓并不占据任何空间,它位于边框之外,不影响元素的尺寸。轮廓主要通过`outline`属性来设置,...

    css参考手册

    CSS 边框属性(Border 和 Outline) 属性 描述 CSS border 在一个声明中设置所有的边框属性。 1 border-bottom 在一个声明中设置所有的下边框属性。 1 border-bottom-color 设置下边框的颜色。 2 border-bottom-...

    解决hover生成border造成的元素移动方法

    4. **使用 `outline`**:`outline` 与 `border` 类似,但它不占据任何空间,也不影响元素尺寸,因此也是解决此问题的一个选择。 ```css .test:hover { outline: 5px solid black; /* 使用 outline 创建边框效果 *...

    css2中文手册 学习css的必选

    border border-color border-style border-width border-top border-top-color border-top-style border-top-width border-right border-right-color border-right-style border-right-width border-bottom border-...

    [浓缩精华]CSS开发人员必备的参考手册之三

    本文档将详细介绍与margin、padding、border、outline以及一些其他CSS属性相关的知识点。 #### Margin 和 Padding - **Margin**:边距,用于控制元素与其他元素之间的距离。可以通过`margin-top`、`margin-right`...

    使用CSS实现outline切换的动画效果

    在提供的标签中,“CSS outline”是指CSS中的`outline`属性,用于设置元素的轮廓,不同于边框(border),轮廓不占据空间,且可以是虚线、实线或其他形状,颜色和宽度也可以自由设定。 部分内容中提到了一个名为`...

    CSS3常用属性大全.pdf

    边框属性(Border 和 Outline) 边框属性用来设置元素的边框样式。这些属性包括: * border:在一个声明中设置所有的边框属性。 * border-bottom:在一个声明中设置所有的下边框属性。 * border-bottom-color:...

    CSS常用属性及描述.pdf

    接着是边框属性(Border 和 Outline)。边框可以用来定义元素的边缘样式,包括宽度、颜色和样式。例如: ```css .d1 { border: 5px solid gray; } ``` 这里`border`简写属性设置了所有边框的宽度、样式和颜色。更...

    kindle-专用版 w3school-css参考手册

    以下,我们将深入探讨kindle专用版w3school-css参考手册中提到的动画属性(Animation)、背景属性(Background)以及边框属性(Border和Outline)的相关知识点。 首先,关于动画属性(Animation),它是CSS3新增的...

    轮廓和圆角1

    `outline`、`box-shadow` 和 `border-radius` 是CSS中三个关键的样式属性,它们分别用于定义元素的轮廓、阴影效果以及边框的圆角,这些特性极大地提升了用户体验和视觉吸引力。 首先,我们来看`outline`属性。`...

    CSS3常用属性大全[参考].pdf

    本文档总结了 CSS3 中的常用属性,涵盖了动画、背景、边框、outline、盒模型等方面。 动画属性 Animation 属性用于规定动画的效果。常用的动画属性包括: * @keyframes:规定动画的关键帧 * animation:所有动画...

    CSS标签大全

    CSS标签大全;CSS 背景属性(Background);CSS 边框属性(Border 和 Outline)……

    CSS3常用属性大全 (2).docx

    **CSS3边框和轮廓属性(Border and Outline)** - `border`:简写属性,用于设置边框的颜色、样式和宽度。 - `border-bottom`, `border-left`, `border-right`, `border-top`:分别用于设置下、左、右、上边框的属性...

    CSS属性列表.docx

    3. **边框属性(Border 和 Outline)** - `border-bottom`, `border-bottom-color`, `border-bottom-style`, `border-bottom-width`: 分别设置底部边框的颜色、样式和宽度。 - `border-color`, `border-left-color...

    css属性(功能分类).pdf

    **CSS边框属性 (Border 和 Outline)** 边框属性用于定义元素边框的样式、宽度和颜色: 1. `border`: 简写属性,用于设置所有边框属性。 2. `border-bottom`, `border-left`, `border-right`, `border-top`: 分别...

Global site tag (gtag.js) - Google Analytics