版权声明：如有转载请注明出处 http://blog.csdn.net/modurookie ,谢谢 https://blog.csdn.net/MoDuRooKie/article/details/84566437
创建聚焦样式
:focus伪类，表示获得焦点的元素（如表单输入）。当用户点击或触摸元素或通过键盘的 “tab” 键选择它时会被触发。outlineCSS 属性，设置一个或多个单独的轮廓属性的简写属性 ， 例如outline-style,outline-width和outline-color。 多数情况下，简写属性更加可取和便捷。:hover伪类，可以创建复杂的层叠机制。触摸屏非常普遍，所以网页开发人员不要让任何内容只能通过悬停才能展示出来，不然这些内容对于触摸屏使用者来说是很难或者说不可能看到。::before伪元素，常通过 content 属性来为一个元素添加修饰性的内容。
/* Selects any <input> when focused */
input:focus {
color: red;
}
/* 宽度 | 样式 | 颜色 */
outline: 1px solid white;
/* two identical declarations */
:link:hover { outline: 1px solid #000; }
:link:hover { outline: solid black 1px; }
/* CSS3 语法 */
element::before { 样式 }
/* （单冒号）CSS2 过时语法 (仅用来支持 IE8) */
element:before { 样式 }
/* 在每一个p元素前插入内容 */
p::before { content: "Hello world!"; }
q::before {
content: "«";
color: blue;
}
q::after {
content: "»";
color: red;
}