gpt4 book ai didi

html - 这个灰色背景是从哪里来的?

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

我不明白为什么我体内的容器流体 div 顶部有灰色背景,也不知道如何摆脱它。我假设这是 Bootstrap 添加的东西。 enter image description here我能够用

摆脱它
container-fluid *{
background-color:#fff;
}

但这会导致超大屏幕的按钮背景出现问题。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Resuarant Name</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css">
<link href="css/custom.css" rel="stylesheet" type="text/css">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<nav class="navbar navbar-right">
<div class="container">
<ul class="menuItems">
<li>Menu</li>
<li>Reservations</li>
<li>Reviews</li>
<li>Photos</li>
</ul>
<form id="searchForm">
Search
<input type="text" name="search"><br/>

</form>
</div>
</nav>
<nav class="navbar-header">
<div class="container">
<ul class="mainMenu">
<img id="logo" src="images/logo001.png"/>
<li>Home</li>
<li>History</li>
<li>Recipes</li>
<li>Shop</li>
<li>Contact</li>
</ul>
</div>
</nav>

</head>

<body>
<div class="container-fluid">
<div class="jumbotron">
<h1>Hello, world!</h1>
<p>This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
<p><a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a></p>
</div>
</div>
</body>
</html>

CSS:

.menuItems{ 
display:inline-block;
list-style:none;
float:right;
}

.menuItems li{
float:right;
padding: 0 10px;
}

#searchForm{
float:right;

}

#logo{
float:left;
max-height:80px;
padding-left:200px;

}


.mainMenu{
float:left;
width:100%;
margin-right:auto;
margin-left:auto;
padding:20px 50px;
border-top:dotted thin;
border-bottom:dotted thin;
}

.mainMenu li{
display:inline-block;
float:right;
padding: 20px 25px;
}

.welcomePost *{

}


.jumbotron *{
float:right;
padding: 0 150px;
}

最佳答案

灰色背景来自 jumbotron,这是它的默认颜色,只需像这样更改 jumbotron 颜色

.jumbotron { 
background-color: // whatever color you want or you can also make it "none"
}

有关 Jumbotron 的更多信息:https://getbootstrap.com/

关于html - 这个灰色背景是从哪里来的?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33949712/

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