css :css禁止focuss

做过类似的css hack首先A和B有共同的父級C
可能需要!improtant的帮助和解决其他一些小问题,但思路就是酱紫的

在前端制作的过程中会发现一些文字/图片链接,或者一些input控件在点击时会在周围出现虚线边框,一般会在火狐和IE浏览器下出现虚线框谷歌下不会有。

这些虚线边框昰作为对视觉设计的一种辅助在不使用鼠标,而用键盘Tab键进行页面浏览时会标示出当前所在的链接或控件的位置,便于浏览这对那些视觉有障碍的人士来说更是必不可少的。


但是有些时候我们却不想使用它们因为浏览器对虚线框的解析有差异,并且不规则所以在視觉设计上反而成为了某种缺陷。所以这种时候我们想要禁用这些虚线边框,使浏览者的视觉享受能够完美无瑕
那么,如何去除这些點击时才会出现的虚线边框呢

hidecss禁止focuss是ie系列的专有属性,能够作用于所有ie序列的浏览器需要配合css的outline:none。
另外hidecss禁止focuss并不是W3C推荐的标准属性。
缺点是非全局控制需要在每个需要去虚线边框的链接或input上加代码。

缺点也很多首先同2一样,也是属于局部控制的手段需要在每┅个需要去虚线边框的标签上使用;
然后这是属于script范畴,对于禁用JavaScript的用户来说不起作用;
将script直接写在html中对于页面效率有负面作用

6. 使用JS遍曆每一个链接

hidecss禁止focuss这个属性和SDK有什么关系呢實际上hidecss禁止focuss和SDK没有实质关系,不过在显示效果上hidecss禁止focuss还是起到一定作用的。

hidecss禁止focuss即隐藏聚焦具有使对象聚焦失效的功能,其功能相当於:

你给的代码如果没有hidecss禁止focuss,那么鼠标点击该超链接则外面出现一个虚线框,即为聚焦而使用了hidecss禁止focuss则不会有虚线框。

而在FF等浏览器Φ则相对比较容易直接给标签 a 定义样式 outline:none; 就可以了,即:

SDK的语句中可以这么用:

上面这个语句知道是什么吧就是出现在Carousel(旋转木马)等組件的上一页的图标,为了去掉点击这个图标出现的虚线框才加上了hidecss禁止focuss=”true”

我要回帖

更多关于 css禁止focus 的文章

 

随机推荐