input:focus {...} //当input元素获得焦点时就会套用这个样式
也就是说当input元素失去焦点就会恢复为原来的样式。因此只需给同一类元素设置默认样式和获得焦点时的样式即可实现你的目的。
CSS 3 选择器加入了一个叫 :target 的伪类,它的作用是选中id与地址栏中#匹配的元素。如下:
html:
<a href="#tab1">tab1</a><a href="#tab2">tab2</a>
<div id="tab1">...</div>
<div id="tab2">...</div>
css:
div { display: none }div:target { display: block }
当用户点击第一个链接的时候,地址栏会变成:http://.......#tab1,此时会显示id为tab1的div,点击第二个链接的时候,地址栏会变成:http://......#tab2,此时会显示id为tab2的div。