gpt4 book ai didi

html - CSS 导航 Bootstrap 问题

转载 作者:太空宇宙 更新时间:2023-11-04 10:27:36 26 4
gpt4 key购买 nike

我这里有这个导航:

<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><h1 class="logo"></h1></a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<span style="color:#FFF; font-style:italic; line-height:66px; padding-right: 10px; font-size:12px; float:left;">In The Heart Of Niagara's Historic Wine Country</span>
<ul class="nav navbar-nav">
<li><a href="index.html">Home</a></li>
<li><a href="rooms.html">Rooms</a></li>
<li><a href="amenities.html">Amenities</a></li>
<li><a href="dining.html">Breakfast and Dining</a></li>
<li><a href="region.html">Discover Our Region</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div><!--/.nav-collapse -->
</div><!--/.container-fluid -->
</nav>

这在 Chrome 和除了 IE 11 之外的所有地方看起来都不错

这是它在 chrome 中的样子:

enter image description here

这是它在 IE 11 中的样子

enter image description here

我的问题是,我无法在我的 IE 11 中重现这一点,但我的客户 IE 11 看起来像第二张图片。我该如何解决这个问题?

这是 CSS:

.navbar-nav {
float: left;
margin: 0;
height: 70px;
}

.navbar-nav>li {
float: left;
height: 70px;
}

最佳答案

检查您的文件是否遵循 html5 结构。

  1. <!DOCTYPE html> - 非常关键,目前的最佳实践是在第一行输入 HTML 文档。
  2. HTML5Shiv - 在 Internet Explorer 版本中启用 HTML5 元素的样式。
  3. Bootstrap 版本 - 请确保您使用的是最新版本的框架。
  4. 兼容模式 IE11 - 如果您正在运行兼容模式,请将其关闭。

关于html - CSS 导航 Bootstrap 问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36684498/

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