两道测试题
阅读代码,指出其存在的兼容性问题,并给出相关解决方案。
第一题:
a img {
display: none;
}
a:hover img {
display:block;
}<ol>
<li><a href=”#nogo”><em>图片一</em><img src=”01.jpg” alt=”" /></a></li>
<li><a href=”#nogo”><em>图片二</em><img src=”02.jpg” alt=”" /></a></li>
<li><a href=”#nogo”><em>图片三</em><img src=”03.jpg” alt=”" /></a></li>
<li><a href=”#nogo”><em>图片四</em><img src=”04.jpg” alt=”" /></a></li>
<li><a href=”#nogo”><em>图片五</em><img src=”05.jpg” alt=”" /></a></li>
<li><a href=”#nogo”><em>图片六</em><img src=”06.jpg” alt=”" /></a></li>
<li><a href=”#nogo”><em>图片七</em><img src=”07.jpg” alt=”" /></a></li>
</ol>
第二题:
a img {
display: none;
}
a:hover img {
display:block;
position: absolute;
}<ol>
<li><a href=”#nogo”><em>图片一</em><img src=”01.jpg” alt=”" /></a></li>
<li><a href=”#nogo”><em>图片二</em><img src=”02.jpg” alt=”" /></a></li>
<li><a href=”#nogo”><em>图片三</em><img src=”03.jpg” alt=”" /></a></li>
<li><a href=”#nogo”><em>图片四</em><img src=”04.jpg” alt=”" /></a></li>
<li><a href=”#nogo”><em>图片五</em><img src=”05.jpg” alt=”" /></a></li>
<li><a href=”#nogo”><em>图片六</em><img src=”06.jpg” alt=”" /></a></li>
<li><a href=”#nogo”><em>图片七</em><img src=”07.jpg” alt=”" /></a></li>
</ol>







ie6下a:hover的bug
a:hover{}加个属性触发
第二个a:hover增加position:relative。
注意你的img的alt后的双引号,一个中文一个英文,a href里的引号是中文的!!!
拖出去枪毙5分钟!
呃。。嗯。。学习了..
@weilaixu:未来老大,
那是字体的原因这个是WP自身wptexturize 函数的问题…不是俺写错…@weilaixu:单、双引号显示的问题解决了。为WP安装“Quotmarks Replacer”插件即可
那个插件我发现也有问题,就是如果“中文english”的话,那么前面的是中文的引号,而后面的会是英文的。