https://i.stack.imgur.com/jbeyI.png
好的,所以我遇到了另一個問題。
我的體寬這么高,我不知道為什么??
我將在下面粘貼代碼。
我嘗試減少利潤,但沒有奏效。
試圖尋找其他答案,但一無所獲。
https://i.stack.imgur.com/jbeyI.png
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap');
#header {
background-color: #0f0f0f;
border-radius: 80px;
height: 100px;
margin: 5px;
}
body {
background-color: #080808;
}
nav {
word-spacing: 15px;
transform: translate(1200px,-50px);
}
ul {
list-style-type: none;
padding-right: 20px;
}
li {
display: inline;
padding: 7px;
}
li, p, h1, #footer{
font-family: "Montserrat", sans serif;
color: aliceblue;
}
h1{
padding-left: 40px;
padding-top: 30px;
}
p {
padding-left: 5px;
padding-right: 5px;
margin-top: 30px;
}
a:visited {
text-decoration: none;
color: aliceblue;
}
a:active {
text-decoration: none;
color: aliceblue;
}
a:hover {
text-decoration: none;
border-color: black;
border-style: solid;
border-width: 2px;
border-spacing: 100px;
}
a {
text-decoration: none;
}
#left {
width: 700px;
}
#right {
float: right;
width: 700px;
transform: translate(0px, -258px);
}
#footer {
clear: both;
text-align: right;
padding: 10px;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Learning</title>
</head>
<header>
<div id="header">
<h1>Filip Moslavac</h1>
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="Contact Page/contact.html">Contact</a></li>
<li><a href="Project Page/projects.html">Projects</a></li>
</ul>
</nav>
</div>
</header>
<body>
<div id="content">
<p id="left">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vulputate feugiat nulla ut aliquam. Cras condimentum vestibulum justo, nec blandit dui convallis non. Quisque gravida cursus odio, id porta diam molestie et. Ut dignissim enim blandit, volutpat neque non, ultrices lorem. Suspendisse potenti. Sed pulvinar ligula ut hendrerit pellentesque. Donec accumsan justo velit, nec auctor dui interdum non. Donec sem neque, pellentesque eu dignissim vitae, iaculis vel erat. Donec ante urna, maximus in ullamcorper a, rutrum in velit. Curabitur vulputate diam nec metus dictum, vel posuere nulla dapibus. Fusce arcu tortor, fringilla a vehicula nec, gravida vel libero. Nam at placerat ex, eget feugiat metus. Vestibulum a hendrerit orci. Sed convallis, mauris sed vulputate tempor, diam enim gravida dolor, sit amet commodo tortor erat in mi.</p>
<p id="right">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vulputate feugiat nulla ut aliquam. Cras condimentum vestibulum justo, nec blandit dui convallis non. Quisque gravida cursus odio, id porta diam molestie et. Ut dignissim enim blandit, volutpat neque non, ultrices lorem. Suspendisse potenti. Sed pulvinar ligula ut hendrerit pellentesque. Donec accumsan justo velit, nec auctor dui interdum non. Donec sem neque, pellentesque eu dignissim vitae, iaculis vel erat. Donec ante urna, maximus in ullamcorper a, rutrum in velit. Curabitur vulputate diam nec metus dictum, vel posuere nulla dapibus. Fusce arcu tortor, fringilla a vehicula nec, gravida vel libero. Nam at placerat ex, eget feugiat metus. Vestibulum a hendrerit orci. Sed convallis, mauris sed vulputate tempor, diam enim gravida dolor, sit amet commodo tortor erat in mi.</p>
</div>
<div id="footer">
Copyright © 2021 Filip Moslavac
</div>
</body>
</html>
uj5u.com熱心網友回復:
如果你檢查你的代碼,你會發現它是你的導航欄太寬了
所以在你的導航 CSS 屬性中洗掉這一行 transform: translate(1200px,-50px);
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/385323.html
