zoukankan      html  css  js  c++  java
  • 两句CSS属性让点击图片链接时的虚线框消失

    昨天做一个导航条,为了节省代码,CSS属性使用了一个Line-height,结果每次点击导航,鼠标过后,惨不忍睹啊。一个扎眼的虚线框,他没包住图片,也没平均包住,虚线框错位很严重,其他一切正常。总之,本来很酷了,有这个虚线就一切白费。

    在蓝色搜索啊搜索,看到了不少代码,不少代码还是很好用的,可就是有点太长了,有用纯CSS的(写了很长),也有用JS的(能用CSS的话我就不去用JS了)
    最后,无意中看了一个属性。
    结果是,两个CSS属性就一切OK了。

    虽然没在蓝色找到我最想要的,不过这里的分享精神是在可敬,小弟不敢独享,特注册账号,就为今天这一贴,希望能对需要这个效果的人提供点帮助。

    CSS 之
    outline (轮廓)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用。

    outline 属性是一个简写属性,用于设置元素周围的轮廓线。

    注释:轮廓线不会占据空间,也不一定是矩形。

    这就可以了,就给点击链接加这个属性   a:active{outline:none}
    可惜,IE下无效   再加一个  a:active {blr:expression(this.onFocus=this.blur());}

    没错,就是这样了
    <style>
    a:active {outline:none;blr:expression(this.onFocus=this.blur());}
    </style>
    这样网页中的所有链接点击都没虚线框了(文字链接、图片链接==)
    示例:
    <style>
    a:active {outline:none;blr:expression(this.onFocus=this.blur());}
    img,a .img{border:0}
    </style>
    <a href="#"> <img src="http://bbs.blueidea.com/images/default/newtopic.gif"></a><br>
    <a href="#"> <img src="http://www.baidu.com/img/baidu_logo.gif"></a><br>
    <a href="#">发新帖</a>
  • 相关阅读:
    实际运用中DataSet、DataTable、DataRow点滴
    SQL语句AND 和 OR执行的优先级
    CS程序,服务器端弹出MessageBox.Show()之类的UI操作???禁止
    使用动态SQL语句实现简单的行列转置(动态产生列)
    表的行列转置
    统计每种车型的数量
    由CAST()函数在.NET1.1和.NET4.0下处理机制不同所引发的BUG
    转载——网站重构的8点建议
    float,double和decimal类型
    优化DB2缓冲页的大小
  • 原文地址:https://www.cnblogs.com/nianshi/p/1551209.html
Copyright © 2011-2022 走看看