ゼロから創るWEBサイト#006 ページの真ん中に表示する
ページの真ん中に表示する
CSSで.wrapper { margin: 0 auto; }を指定する。
@charset "UTF-8";
.wrapper {
max-width: 1600px;
margin: 0 auto;
}
.nav {
list-style-type: none;
}
.nav li {
display: inline;
}
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>WEB STUDY / TOP</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="wrapper">
<!-- ヘッダー -->
<header>
<nav>
<ul class="nav">
<li>
<a href="#">TOP</a>
</li>
<li>
<a href="#">ABOUT</a>
</li>
<li>
<a href="#">HTML</a>
</li>
<li>
<a href="#">CSS</a>
</li>
</ul>
</nav>
</header>
<!-- /ヘッダー -->
<!-- メイン -->
<section>
</section>
<!-- /メイン -->
<!-- フッター -->
<footer>All content copyright WEB SUTUDY 2022 ©</footer>
<!-- /フッター -->
</div>
</body>
</html>