gpt4 book ai didi

html - 在同一行中有 Logo 和文本 - twitter bootstrap

转载 作者:太空宇宙 更新时间:2023-11-04 13:14:40 25 4
gpt4 key购买 nike

使 Logo 和文本响应所有分辨率和大小。我遇到一个问题,当我重新调整浏览器大小时,我的文本会折叠。对于所有 resolutionsizes,我如何确保 Logo 和旁边的文本在同一行中。

<html>
<head>
<title>Header</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/ui-lightness/jquery-ui.css" rel="stylesheet">
<script type="text/javascript" src="slider.js"></script>
<style>
.divider-vertical {
height: 50px;
margin-top: 0;
margin-bottom: 0;
margin-left: 20px;
margin-right: 10px;
border-left: 1px solid #a8a8a8;
border-right: 1px solid #a8a8a8;
}
</style>
</head>
<body>
<div class="container-fluid">
<nav class="navbar navbar-default">
<div class="col-sm-3">
<a class="navbar-brand" href="#">BimAssure</a>
<ul class="nav navbar-nav">
<li class="divider-vertical"></li>
<li><h4 style="margin-top: 15px">ACME - New York</h4></li>
</ul>
</div>
</nav>
</div>
</body>
</html>

下面是我正在研究的 fiddle 。我希望 Logo 和文本在所有分辨率和尺寸中都位于同一行。 http://jsbin.com/yuhibisu/4/edit

最佳答案

你只需要改变这个

<ul class="nav navbar-nav">
<li class="divider-vertical"></li>

对此:

<ul class="nav navbar-nav divider-vertical">
<li> ...

你必须将样式应用于“ul”而不是“li”

检查一下:

http://jsbin.com/yuhibisu/8/edit

关于html - 在同一行中有 Logo 和文本 - twitter bootstrap,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24467368/

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