用于ID

Question

问题：

如何正确设置HTML网站的不同元素？我已经浏览了整个互联网并阅读了书籍，但仍然有点挣扎。

问题：

我的问题是我有一个主标题，就像主要标题＆＃34;对于我的网站显示网站名称，但在我的标题左侧，我想设置一个垂直导航栏，它将与我的标题一致。然而，我在设置导航栏并前往彼此旁边工作时遇到了麻烦，而不是其中一个在另一个之上。

HTML：

<!DOCTYPE html>
<html lang="en">
<link rel="stylesheet" type="text/css" href="homepage.css">
<head>
  <title>CSGOWin | Win Big!</title>
</head>
<body>
<div class="navbar">
  <ul>
    <li><a href="Jackpot.html">Jackpot</a></li>
    <li><a href="Jackpot.html">Coinflip</a></li>
    <li><a href="News.html">Giveaways</a></li>
    <li><a href="about.html">About Us</a></li>
    <li><a href="contact.html">Contact Us</a><li>
  </ul>
</div>
<h1>CSGO Win</h1>

</body>
</html>

CSS：

body {
padding: 0;
margin: 0;
background-image: url(bgimg.jpg);
width: 100%;
height: 100%;
background-size: 100%;
}
h1 {
font-family: Arial, Verdana, sans-serif;
background-color: #FFA500;
border-style: solid;
border-radius: 25px;
text-align: center;
margin-top: 50px;
margin-left: 350px;
margin-right: 350px;
padding-top: 1%;
padding-bottom: 1%;
font-size: 45px;
}
ul {
list-style-type: none;
margin-left: 50px;
margin-right: 85%;
margin-top: 50px;
background-color: #FFA500;
}
li a {
font-family: Arial, Verdana, sans-serif;
display: block;
}
.navbar{
}

最后，我对堆栈溢出很新，所以如果我的问题没有完全详细，我会道歉。如果有的话，我会回答问题。谢谢你的帮助。

Answer 1

如评论中所述，您可以使用float: left查看此笔http://codepen.io/anon/pen/bpWzeK?editors=1100。另一种方法是使用flex。

Answer 2

您可以将class或id属性添加到某些html标记，然后在样式表中引用该类或id

- ＆GT; .navbar { } 使用＆＃34; navbar＆＃34;引用任何标记class将获得该块中的样式

- ＆GT; #thisIsAnID { } 引用任何标记为id＆＃34; thisIsAnID＆＃34; ID 所以。用于类

HTML网站的样式元素

2 个答案:

用于ID