Question

我使用的是bootstrap version3.3.0。这是bootstrap中水平导航栏的代码：

导航bars.html：

FireFox driver = new FireFoxDriver();
activesheet.Range["A" + n].Text = driver.findElement(By.XPath("abc123")).Text;

移动设备上述程序的输出是包含在框架中的相同程序：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
    href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script
    src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script
    src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<title>Insert title here</title>
</head>
<body>

    <div class="container">
        <nav class="navbar navbar-light bg-faded">
            <a class="navbar-brand" href="#">Navbar</a>
            <ul class="nav navbar-nav">
                <li class="nav-item active"><a class="nav-link" href="#">Home
                        <span class="sr-only">(current)</span>
                </a></li>
                <li class="nav-item"><a class="nav-link" href="#">Features</a></li>
                <li class="nav-item"><a class="nav-link" href="#">Pricing</a></li>
                <li class="nav-item"><a class="nav-link" href="#">About</a></li>
            </ul>
            <form class="form-inline pull-xs-right">
                <input class="form-control" type="text" placeholder="Search">
                <button class="btn btn-success-outline" type="submit">Search</button>
            </form>
        </nav>
    </div>

</body>
</html>

显示如下：

请帮助解决为什么框架集和框架的行为如此，解决方案是什么。提前致谢。

Answer 1

行为是由.navbar-brand中的规则引起的，即float：left。使用媒体查询＆＃34;无法＆＃34;它解决了这个问题。

@media only screen and (min-width : 375px) and (max-width : 788px) { 
       body .navbar-brand{
             float:none;
        } 
 }

Bootstrap的导航栏在框架集内部没有正确显示

1 个答案: