10-13
http://taligarsiel.com/Projects/howbrowserswork1.htm#The_main_flow
去除单选按钮/链接获取焦点时虚线框
一种解决方法：onfocus = "this.blur()"
在点击后立即使其失去焦点。很好达到去除虚线框的效果，各浏览器均有效。但此时tab键失效，在点击该链接or单选按钮后失去焦点，tab无法向下选择。
从实现方法上来说也违背了正常的逻辑。同时关于this.blur()的利弊可参见下此博文：关于使用onfocus=”this.blur()”的利与弊
另一种解决方法：a:focus{定义outline属性}
outline属性：【outline （轮廓）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。轮廓线不会占据空间，也不一定是矩形。】
outline用于控制这里所说的虚线框的样式。（IE6、7不支持该属性。:focus伪类，IE6、7亦不支持。IE6、7：元素的hidefocus属性，不影响tab，只是隐藏虚线框。）
可以简单隐藏，a:focus{outline:none;}。
然而，因尽量承认虚线框突出当前焦点的合理性。
可以给focus定义替代样式。但定义:focus样式，效果在各浏览器有差异。例如，ie6、7不支持，so一直是小虚线框，ie8/9没什么问题，只是单选按钮会显示背景色，如果设定了。firefox下一切正常，单选按钮无背景色。chrome，不响应对单选按钮、a:focus定义，有文本框有效。但tab键时会有默认样式突出显示当前焦点元素。
http://css-tricks.com/removing-the-dotted-outline/
Because that outline was providing an important accessibility
feature, you should really (really) consider adding back in a style
for your links focus and active states.
http://www.outlinenone.com/#test1
If you must remove it, provide alternative styling
- Give it a background colour - Test background colour change
- Change the text colour (don't forget to make it high contrast for colour blind people!) - Test text colour change
- Provide a custom outline - Test text outline change
- Go high visibility - Test high visibility
与:hover,:active同时定义:focus.
Personally, I just like to make them the same as the hover state. It's about the same thing, as far as actual function. Whatever your hover state is, even if it's shifting a background image or changing size or whatever, it can be joined with the active and focus states. Like so:
a:hover, a:active, a:focus { // styling for
any way a link is about to be used }
测试：
click me, you can also see my outline.
结论：承认虚线框的合理性。必要时自己掂量着办...