gpt4 book ai didi

html - DOCTYPE HTML 导致带有内联 li 渲染的 IE8 出现意外问题

转载 作者:行者123 更新时间:2023-11-28 18:07:19 35 4
gpt4 key购买 nike

我在一个页面上工作,我想在该页面上显示一个菜单(一组链接),其中菜单项水平放置并位于页面的右侧(类似于您在顶部看到的内容登录时的 stackoverflow 页面)。

HTML 看起来像这样:

<!DOCTYPE HTML>
<html>
<head>
<style type="text/css">@import url(styles/style.css);</style>
</head>
<body >
<div class="test">
<!-- float right -->
<ul class="fr">
<li><img src="images/1.gif" alt="image 1"/></li>
<li><img src="images/2.gif" alt="image 2"/></li>
<li><img src="images/3.gif" alt="image 3"/></li>
</ul>
</div>
</body>
</html>

“测试”CSS 类如下:

.test ul {list-style:none; }
.test li { display:inline;}

这在 Chrome 和 Firefox 上显示良好。 li 元素内嵌呈现在页面的右侧,全部在一行上。

但是,在 IE8 上,这些元素在页面右侧依次呈现。

我开始通过一次删除一行来调查导致此问题的原因,并意识到摆脱:

<!DOCTYPE HTML>

从那个 HTML 页面,即使在 IE8 中也能正常显示。当 出现在该页面上时,有人知道是什么导致了问题吗?

当然,这只是我页面的精简版,我确实想在我的页面中使用 HTML5 功能,因此仅删除它似乎不是解决方案。

最佳答案

我猜这是 IE8 中 display: inline 的错误。尝试使用:

.test li {display: inline-block; }

关于html - DOCTYPE HTML 导致带有内联 li 渲染的 IE8 出现意外问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19356132/

35 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com