`
youanyyou
  • 浏览: 198706 次
  • 性别: Icon_minigender_1
  • 来自: 长沙
社区版块
存档分类
最新评论

通过CSS定义去掉页面中点击a链接和button等外的虚框

阅读更多

方法1,利用.htc文件(好像此方法仅适合IE):

 

利用.htc文件来轻而易举地实现成批去除超链虚框。以下内容保存为后缀名为.htc的文件:

 

1.        <public:attach event="onfocus" />

 

2.        <script language="java script">

 

3.        function quit(){

 

4.        this.blur();

 

5.        }

 

6.        </script>

 

然后,在需要去除超链虚框的页面的<head></head>之间加入:
<style type="text/css">
a {behavior:url("htc
文件")} /*注意htc文件的存放路径,如果此句放在css文件里更应注意路径问题*/
</style>

 

如果页面已经有了css文件,只需要将 a {behavior:url("htc文件")} 一句插入里面即可。这样,该页面的超链在点击之后的虚框将不复存在,页面显得干干净净。

 

方法2css样式表里加如下代码(此方法可容适合IEfirefox):

 

去掉链接时的虚框只要在你的样式表中加入以下代码,就可以去掉链接时烦的的虚框 

 

1.        a,area { blr:expression(this.onFocus=this.blur()) } /* for IE7.0及以下版本*/

 

2.        :focus { outline-style: none; } /* for FirefoxIE8.0 */ 

 

注:此方法用在默认提交Button按钮上,在IE7.0及以下版本将失去"Enter"键自动提交功能,所以方法2也可用去清除提交按钮自动提交功能!

 

方法3:去掉默认提交Button外面的虚框,同时保留默认键盘"Enter"键提交功能

 

1.        .button { hide-focus:expression(this.hideFocus=true); } /* for IE7.0及以下版本 */

 

2.        .button:focus { outline-style:none; }/* for FirefoxIE8.0 */ 

                  

0
1
分享到:
评论

相关推荐

    用css把a链接模拟成button的样子的方法

    在提供的示例代码中,作者通过CSS为`&lt;a&gt;`标签定义了一个名为`.button`的类。这个类包含了上面提到的所有属性,以及针对不同状态的伪类设置: ```css a.button:link, a.button:visited { padding: 3px 6px 2px 8px;...

    css去掉链接虚框

    在网页设计中,当用户通过键盘导航(例如使用Tab键)或使用辅助技术(如屏幕阅读器)与页面交互时,浏览器默认会在可聚焦元素(如`&lt;a&gt;`标签、某些表单元素等)周围显示一个虚线边框,称为“焦点轮廓”或“虚框”。...

    CssButton按钮样式

    在网页设计中,CSS(Cascading Style Sheets)是一种用于定义HTML或XML(包括SVG、XHTML等)文档中元素外观、布局和结构的关键技术。本文将深入探讨如何使用CSS来创建美观且功能丰富的“CssButton”按钮样式,以及...

    好看的button样式CSS

    在网页设计中,按钮(Button)的样式是一个重要的组成部分,它不仅影响页面的美观,还直接关乎用户体验。本文将深入探讨如何使用CSS(层叠样式表)来创建好看且具有吸引力的button样式。 首先,CSS是网页设计中的...

    如何去掉图片热点链接或超链接的虚线框?.rar

    总结,去除图片热点链接或超链接的虚线框主要通过CSS的`border`和`outline`属性实现。通过内联样式或定义CSS类选择器,我们可以有效地控制链接的显示效果,同时兼顾网页的美观性和可访问性。在实际应用中,应根据...

    css button

    一个简单的CSS按钮通常由HTML的`&lt;button&gt;`或`&lt;a&gt;`元素构建,然后通过CSS进行样式定制。例如: ```html &lt;button class="myButton"&gt;点击我&lt;/button&gt; ``` 二、CSS按钮样式属性 1. 颜色与背景: - `color`: 设置文本...

    button按钮样式美化

    在网页设计中,按钮(Button)是用户交互的重要元素,其样式美化对于提升用户体验和页面整体视觉效果至关重要。本文将详细讲解如何使用CSS(Cascading Style Sheets)来美化页面上的button控件。 首先,CSS是一种...

    虚线边框去除

    如果你想一次性去除页面上所有元素的虚线边框,可以在全局CSS样式表中设置: ```css * { border-style: none; } ``` 这将覆盖所有元素的边框样式,使其无边框。 2. **特定元素去除虚线边框** 对于特定的...

    一些漂亮的css3button

    在实际项目中,通过学习和利用这些CSS3按钮样式,设计师和开发者可以创建出具有独特视觉效果和交互体验的网页按钮,提升用户界面的美感和用户体验。例如,可以使用伪类(:hover, :active, :focus)来实现按钮在鼠标...

    html+css 登录页面

    在本示例中,开发者使用HTML(HyperText Markup Language)来构建页面结构,CSS(Cascading Style Sheets)来定义页面的样式和布局,创建了一个简洁且实用的登录界面。 HTML是网页内容的基础,用于描述网页的结构。...

    CSS样式文件设置网页中的页面元素的CSS

    在网页设计中,CSS(Cascading Style Sheets)是一种至关重要的技术,用于定义网页中各个元素的外观、布局和结构。CSS通过分离内容与表现,使得网页设计更加灵活且易于维护。本篇将深入探讨标题提及的“CSS样式文件...

    50个css button样式

    在网页设计中,按钮(Button)是用户交互的重要元素,其样式直接影响到用户体验和界面美观。"50个css button样式"这个资源提供了一系列CSS代码示例,旨在帮助开发者创造出吸引眼球、功能各异的按钮。下面,我们将...

    CSS去掉A标签(链接)虚线框的方法

    至于IE浏览器,比较遗憾的是,目前还没有找到通过CSS去掉链接虚线框的完美解决方法。所以,只能使用IE特有的`hidefocus`属性来实现这一需求。 总结来说,去除非必要的焦点轮廓线,主要集中在移除`outline`属性,并...

    css如何去掉点击a链接带来的虚框

    总的来说,根据项目的需求和目标浏览器范围,你可以选择适合的 CSS 解决方案来去掉`&lt;a&gt;`标签点击后的虚框。不过,记得在移除虚框时要考虑页面的可访问性,确保键盘导航的用户仍然能够清晰地识别当前聚焦的元素。如果...

    css3-button.

    标题 "css3-button" 暗示我们关注的是CSS3在创建按钮(button)方面的应用。CSS3是层叠样式表的第三版,它引入了许多新的功能和改进,使得网页设计更加丰富多彩,尤其是在按钮设计上提供了更多的可能性。下面将详细...

    CSS3实现酷炫流光页面动画特效.zip

    在网页设计领域,CSS3(层叠样式表第三版)的出现为开发者提供了更多创造性的可能性,特别是对于页面动画和视觉效果的实现。本资源"CSS3实现酷炫流光页面动画特效.zip"就是一个很好的例子,它展示了如何利用CSS3的...

    html+css登录页面

    在"6套登录模板"中,可能包含了不同设计风格和功能的登录页面示例,比如扁平化设计、暗黑模式、浮动效果、验证提示等。通过学习和研究这些模板,开发者可以了解到如何根据项目需求定制登录界面,同时提升用户体验。 ...

    css_各种超级链接样式

    在这个主题“css_各种超级链接样式”中,我们将深入探讨如何使用CSS来定制超级链接的样式,使其更具吸引力和功能性。 1. **超级链接(a标签)基础** 超级链接是由HTML的`&lt;a&gt;`标签创建的,用于链接到其他页面或资源...

    鼠标点击不刷新页面,切换当前CSS

    在网页开发中,实现“鼠标点击不刷新页面,切换当前CSS”的功能,主要是为了提供更好的用户体验,让用户在浏览多级菜单或使用多个功能时能够清楚地知道当前所处的位置,而无需每次操作都重新加载整个页面。...

    Button-(CSS).rar_button css_button横着css_按钮css

    在网页设计中,按钮(Button)是用户交互的重要元素,CSS(Cascading Style Sheets)则是用于美化这些元素的关键技术。本资源“Button-(CSS).rar”提供了多种五彩圆滑的按钮样式以及一个横向导航菜单的实现,适用于...

Global site tag (gtag.js) - Google Analytics