Question

我和我的朋友正在建立一个新网站，我们都是HTML和CSS的初学者。我让这个网站测试的东西，但有一个问题。我可以滚动，但这并不适合。

Index.html页面：

<html>
<title>ClipOfTheDay</title>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<meta name="disrciption" content="Welcome to ClipOfTheDay, the awesome website where you can see your favourite clips every day!">
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
</head>
<br>
<center><p><i><font color="#989898" face="times, serif" size="6">
Welcome to Clip Of The Day!
</font></i></p></center>
<br>
<hr>
<body>
<br>
<br>
<p><i><font color="#989898" face="times, serif" size="4">
<div style="position: absolute; left: 24%; top: 22%; height: 80%; width: 80%">Music Video</div>
<div style="position: absolute; left: 73%; top: 22%; height: 80%; width: 80%">Funny Video</div>         
</font><p><i>
<Br>
<div style="position: absolute; left: 12%; top: 30%; height: 80%; width: 80%"><iframe width="420" height="390" src="//www.youtube.com/embed/McEoTIqoRKk" frameborder="0" allowfullscreen></iframe></div>
<div style="position: absolute; left: 60%; top: 30%; height: 80%; width: 80%"><div id="header"><iframe width="420" height="390" src="//www.youtube.com/embed/fZfH6Dt_E3k" frameborder="0" allowfullscreen></iframe></pre></div>
<br>
<div style="position: absolute; left: 0%; top: 70%; height: 80%; width: 80%"><p><i><font color="#989898" face="times, serif" size="2">&copy; All rights reserved ClipOfTheDay
            </font></i></p></p>
</body>
</html>

我的style.css

body
{
background-image:url('Background.jpg');
}

hr
{
color: #505050;
background-color: #505050;
height: 0,5px;
}

br {
        line-height: 80%;
     }

{ 
    position: relative; 


html 
{
width: 100%;
height: 100%;
clip: auto;
position: absolute;
overflow: hidden;
}

我希望你们能帮助我们！

Answer 1

首先，hr中的高度不应使用逗号作为小数点。 height:0.5px可以解决问题

其次，有一个未使用的（？）部分 { position: relative; 在代码中。这会破坏html的下半部分，使整个样式表失败。

如果修复它应该有效。

随机可滚动页面？

1 个答案: