所以,我到這個代碼的每一處都會在垂直滾動條上出現奇怪的現象。如果你知道它是什麼,告訴我這個錯誤以及我如何解決它。爲什麼我的網站上有一個水平滾動條?
錯誤可能是在css但我包括所有的代碼,所以你可以看看。
我會給你所有的代碼,你告訴我什麼是錯的。 Thx
我需要寫一些隨機單詞,所以我可以發表這個。
*::selection {
background: #333;
}
*::-moz-selection {
background: #333;
}
@font-face {
font-family: 'watchmen';
src: url('--watchmen---webfont.woff2') format('woff2'),url('--watchmen---webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
body {
\t background-color: red;
\t font-family: 'Hind', sans-serif;
}
* {
\t padding: 0;
\t margin: 0;
}
#titletext {
\t font-family: watchmen;
\t color: #FEEE2E;
\t font-size: 6.5vw;
}
#logo_span {
\t color: #146EAD;
}
#linktotwo {
\t text-decoration: none;
\t color: #146EAD;
}
#title {
\t
\t position: absolute;
\t width: 82vw;
\t height: 12vh;
\t text-align: center;
\t line-height: 12vh;
\t top: 50%;
\t left: 50%;
\t margin-top: -6vh;
\t margin-left: -41vw;
}
#one {
\t background-color: #030200;
\t background-size: cover;
\t width:100vw;
height: 100vh;
}
#two {
\t height: 100vh;
\t width: 100vw;
\t background-color: #0B4F77;
}
#favul {
\t list-style-type: decimal;
font-family: 'Josefin Sans', sans-serif;
padding-left: 8vw;
margin: 6.5vh auto;
}
#favul > li {
\t margin: 1vw 0;
}
#favtit {
\t text-align: center;
}
#fav {
\t border: 1px solid #000;
\t position: absolute;
\t font-size: 48px;
\t left: 50%;
\t padding: 15px;
\t width: 600px;
\t height: 50vh;
\t margin-left: -316px;
\t overflow: hidden;
\t top: 150vh;
\t margin-top: -32vh;
\t background-color: #0A4366;
}
#flash {
\t color: #FF4500;
}
#bat {
\t color: #000;
}
#arrow {
\t color: green;
}
#manh {
\t color: #1580c1;
}
#images {
\t position: absolute;
\t bottom: 0%;
\t left: 0%;
}
#images > img {
\t width: 100%;
}
<html lang="en">
<!DOCTYPE html>
<html>
<head>
\t <title>I Love DC Comics</title>
\t <meta charset="UTF-8">
\t <link rel="icon" type="image/png" href="favicon-32x32.png" sizes="32x32" />
\t <link rel="icon" type="image/png" href="favicon-16x16.png" sizes="16x16" />
\t <meta name="description"
\t content="I just love DC Comics and I write some stuff on this Website"/>
\t <meta name="robots" content="index,follow"/>
\t <link rel="stylesheet" type="text/css" href="styles.css">
\t <link href="https://fonts.googleapis.com/css?family=Hind:600" rel="stylesheet">
\t <link href="https://fonts.googleapis.com/css?family=Josefin+Sans:300" rel="stylesheet">
\t <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
\t <script type="text/javascript" src="jumpto.js"></script>
\t <script type="text/javascript" src="script.js"></script>
</head>
<body>
<div id="one">
<div id="title">
<p id="titletext">ONLY DC <span id="logo_span"><a id="linktotwo" href="#two">¤</a></span> COMICS!</p>
</div>
</div>
<div id="two">
<div id="fav">
<p id="favtit">My Favorite Characters</p>
<ul id="favul">
\t <li>The <span id="flash">Flash</span></li>
\t <li><span id="bat">Batman</span></li>
\t <li><span id="arrow">Green</span> Arrow</li>
\t <li>Dr. <span id="manh">Manhattan</span></li>
</ul>
<div id="images">
<img src="characters.jpeg" alt="characters"/>
</div>
</div>
</div>
</body>
</html>