私は本当にコーディングが新しく、これはどこかで答えられると確信しています。しかし、私が見ているところでは、私はあまり理解していない。 text-align: center
を使用してナビを整列すると、ロゴがページの上部に移動しているように、ロゴがその行の下に表示されます。あなたは画像を選択するとhereを見ることができます。(HTML/CSS)なぜナビはページの上部に移動しませんか?
余白を使用しようとしましたが、そのメニューが表示されません。私もdisplay: inline
を使ってみましたが、それは私のnavに余分なサイズを加え、それを選択するとhereと表示されているように、ページの上部には当たらないでしょう。
ここでは、コードです:
head {}
body {
background-image: url(img/background.jpg);
}
.logo {
display: inline;
}
div.nav {
display: inline;
}
div.content {
text-align: center;
}
<!DOCTYPE html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>LiaamB Home</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="shortcut icon" type="image/png" href="img/icon.png" />
</head>
<a href="index.html"><img src="img/logo.png" width=200 height="200" class="logo"></a>
<img src="img/worktitle.png" width="200" height="200">
<div class="nav">
<a href="index.html"><img src="img/home.png" width="250" height="100"></a>
<a href="work.html"><img src="img/work.png" width="250" height="100"></a>
<a href="store.html"><img src="img/store.png" width="250" height="100"></a>
<a href="contact.html"><img src="img/contact.png" width="250" height="100"></a>
<a href="videos.html"><img src="img/videos.png" width="250" height="100"></a>
</div>
</head>
<body>
<div class="content">
<img src="img/about.png" width="1500" height="150">
</div>
</body>
</html>
jijフィドルを提供し、私は助けることができるかもしれません。 –
あなたのnav divはhtmlボディ内にありません。 – hairmot
jsのフィドルは何ですか?私は非常にごめんなさい、新しい、これを修正しようとしましたatleast 4時間を過ごしました:) – LiaamB