我剛開始使用 CSS 和 HTML。我無法在同一條線上同步我的 div 和 nav 標簽。問題是我的 div 和 nav 離彼此太遠了。這里有什么錯誤?
/* CSS RESET */
* {
margin: 0;
padding: 0;
}
#navbar {
align-items: center;
display: flex;
}
/* Logo And Image */
#logo {
margin: 10px 20px;
}
#logo img {
margin: 0px 0px;
}
/* Navigation Bar:-List Styling */
#navbar ul {
display: flex;
}
<nav id="navbar">
<div id="logo">
<img src="top.png" alt="Image Failed To Load !" width="10%" />
</div>
<ul>
<li class="item"><a href="#">Home</a></li>
<li class="item"><a href="#">About Us</a></li>
<li class="item"><a href="#">Recommendations</a></li>
<li class="item"><a href="#">Contact Me</a></li>
</ul>
</nav>
<section class="home">
<h1 class="h-primary">
Lorem ipsum
</h1>
</section>
uj5u.com熱心網友回復:
洗掉或更改此邊距:
#logo {
margin: 10px 20px;
}
在10px頂端和底部添加空間。
在20px對左,右增加了空間。
uj5u.com熱心網友回復:
我檢查并測驗了您的代碼,根據您的要求,我了解到您希望 div 和 ul 位于導航內的同一行。那么你應該使用 display:flex; 為元素。
不要忘記將您的 css 鏈接到您的 HTML。
<link rel="stylesheet" href="test.css">
在我的測驗中似乎完全沒問題,div 和 ul 在同一行
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/347319.html
