html - Safari <img src> css 有问题

标签 html css safari image

我目前已经对所有前端设计进行了编码,以便在 Chrome 中 100% 正确工作。现在我正在进行跨浏览器测试和修复错误。我在 Safari 中遇到了一个奇怪的错误,图像无法正确显示。查看 HTML:

<li class="newsfeedlist-item">
<div class="questionslogo"</div>
<div class="newsfeedlist-image">
<img src="http://images.ted.com/images/ted/2ade6b48aac1eb21b7b90fe43335a8e70771455c_50x50.jpg"></div>
<div class="newsfeedlist-content">
<h3><b><a href="#">What Is The Best Way To Become A Photographer? </a></b></h3>
<div class="newsfeedlist-bodytext"> What if a fish came across a river? Then what???    What if a fish came across a river? Then what???    What if a fish came across a river? Then what???    What if a fish came across a river? Then what???    What if a fish came across a river? Then what???</div>  
<div class="newsfeedlist-questionauthor"> <i>Started By <a href="#">Robert Sopel</i></a></div>
</div>
</li>

您会注意到它是一堆简单的 div,所有引用的 CSS 脚本。 Safari 中的错误(在我看来)不是来自 CSS,而是来自 html 中的“img src”标签。但是这里是“newsfeedlist-image”和“questionslogo”的 CSS,两者都有错误:

.questionslogo {
width: 84px;
background: url(images/questions.png) top left no-repeat;
padding: 8px 0px 0px 100px;
float: left;
}

.newsfeedlist-image {
width: 48px;
float: left;
}

请注意,我已经尝试为两者和 display: block 固定高度,但这并没有改变在 Safari 中它无法识别图像的事实(你不能点击并拖动它,它只是悬停在它)请参见下面的屏幕截图。

Chrome :

http://www.cl.ly/3f1Z143b3X0V1N1i1b1c

火狐:

http://www.cl.ly/471R002N3v182q2W1V1j

最后是 Safari:

http://www.cl.ly/1X3H2W1A1V3b0G3V2n0G

我认为这是一个简单的修复,但目前无法解决。将不胜感激任何帮助。谢谢!!!

最佳答案

问题出在这部分,你有错别字:

<div class="questionslogo"</div>

通过添加 > 来修复它:

<div class="questionslogo"></div>

要自己查找此类错误,最好使用以下方法验证您的 HTML:http://validator.w3.org/


我还注意到你还有:

<i>Started By <a href="#">Robert Sopel</i></a>

您以错误的顺序关闭了标签,应该是:

<i>Started By <a href="#">Robert Sopel</a></i>

关于html - Safari <img src> css 有问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6284025/

相关文章:

javascript - 在外部 iframe 中设置输入字段的值

HTML/CSS | 2 个彼此相邻的 div - 左 div 250px,右 div 100%

CSS3手电筒效果

html - 导航不会垂直对齐

css - 带有 Bootstrap 的混合混合模式在 safari 中不起作用

Javascript 用 HTML 替换文本

html - 元素网格中元素的 CSS/HTML 对齐显示不正确

html - 两个div之间的神秘空间

html - 调整具有动画 "translate(%)"的元素大小时 Safari 错误的解决方法

html - 如何让背景图像 CSS 在 Safari 和 Internet Explorer 上工作?