Question

所以我已经按照图像对齐，但现在我想将与对齐的图像放在与导航栏相同的条/线上。 CSS代码，导航栏部分：

body {
    font-family: "Trebuchet MS", Verdana, sans-serif;
    font-size: 16px;
    background-color: lightblue; 
    color: #696969;
    padding: 3px;
}

#main {
    padding: 5px;
    padding-left:  15px;
    padding-right: 15px;
    background-color: #ffffff;
    border-radius: 0 0 5px 5px;
}

h1 {
    font-family: Georgia, serif;
    border-bottom: 3px solid #cc9900;
    color: #996600;
    font-size: 30px;
}

table {
    width:100%;
}

table, th , td {
    border: 1px solid grey;
    border-collapse: collapse;
    padding: 5px;
}

th {
    text-align: left; 
}

table tr:nth-child(odd) {
    background-color: #f1f1f1;
}
table tr:nth-child(even) {
    background-color: #ffffff;
}

ul#menu {
    padding: 0;
    margin-bottom: 11px;
}

ul#menu li {
    display: inline-block;
    margin-right: 2px;
}

ul#menu li a {
    background-color: orange;
    padding: 10px 40px;
    text-decoration: none;
    color: #ffffff;
    border-radius: 4px 4px 4px 4px;
}

ul#menu li a:hover {
    color: white;
    background-color: blue;
}

table {
    width:100%;
}

table, th , td {
    border: 1px solid grey;
    border-collapse: collapse;
    padding: 5px;
}

th {
    text-align: left; 
}

table tr:nth-child(odd) {
    background-color: #f1f1f1;
}
table tr:nth-child(even) {
    background-color: #ffffff;
}

HTML code：

<!DOCTYPE html>
<html>

<head>
  <title>X-treme FreeRoam</title>
  <link href="site.css" rel="stylesheet">
</head>
<body>

<nav id="nav01"></nav><img src="images/title.png" width="386px" height="56px" align="right">

<div id="main">
  <center><div id=”header”><img src="images/MyBB Logo 3.png" style="width:970px;height:280px"></div></center>
  <h1><center><b>Welcome to X-treme FreeRoam's website</b></center></h1>

  <p><center>Welcome to X-treme FreeRoam's website, we setup a forum website for players from X-treme FreeRoam server in Grand Theft Auto San Andreas Multiplayer to communicate and voice their feedback and improvements for the server. This page is the homepage of our server. You can talk about other things unrelated to Grand Theft Auto on the Unrelated topic under the Other forum by clicking on the Forum tab in the navigation bar. Please do look around.</center></p>

</div>

<footer id="foot01"></footer>

<script src="script.js"></script>

</body>
</html>

请注意，我的nav01和foot01来自我创建的相同javascript

导航栏和图像在同一行

0 个答案: