gpt4 book ai didi

jquery - 导航栏上的 Logo 溢出(Bootstrap 3)

转载 作者:可可西里 更新时间:2023-11-01 14:47:13 26 4
gpt4 key购买 nike

我真的是 bootstrap 的新手,我对它感到有点沮丧。我正在尝试建立一个响应式网站,我需要我的 Logo 溢出导航栏。我在 html 和 css 中完成了(不使用 Bootstrap ),但它没有响应。这就是我想用 bootstrap 做的,但我一直悲惨地失败了。 http://prntscr.com/5tifol这是 html/css 代码:

`<body>
<div id="motodiv">
<div id="text1" style="display:none;">TEXTTEXTTEXTTEXTTEXT</div>
<div id="text2" style="display:none;">TEXTTEXTTEXTTEXTT</div>
</div>
<div id="logo"><img id="logoimg" src="logo.png"></div>`

http://jsfiddle.net/yn7o2neb/这就是我对 bootstrap 所做的 http://prntscr.com/5tifrp这是 Bootstrap 代码:`

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/index.css" rel="stylesheet">
</head>
<body>
<div class = "navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="brand" href="index.html"> <img src="images/logo.png" class="img-responsive clearfix logo"></a>
</div>
</div>
</div>


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>`

http://jsfiddle.net/oc5vgha4/欢迎任何帮助。此外,当我尝试调整图像大小时,导航栏正在调整大小。

最佳答案

.navbar-brand 类上试试这个 CSS

.navbar-brand {                
position: absolute;
left: 0px;
top: 0px;
width: 50px;
margin-left: 0px;
padding: 30px;
}

您可以根据需要调整填充甚至位置。你可以在 http://jsfiddle.net/0hmrd1b8/ 上看到我的例子

希望对您有所帮助!

关于jquery - 导航栏上的 Logo 溢出(Bootstrap 3),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27998582/

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