Fatal编程技术网
  • html/
  • Html 网站上的某些内容与背景不兼容

Html 网站上的某些内容与背景不兼容

html css

Html 网站上的某些内容与背景不兼容,html,css,background,Html,Css,Background,我正在尝试做一些类似的事情（背景图片封面全页） 我不知道为什么我的代码不起作用。也许这是html的问题，这就是为什么我删除了大部分代码来检查它，什么不起作用。这就是为什么我认为这是css的一个问题。但我不知道。这是我的密码 <!doctype html> <html lang = "pl"> <head> <meta charset = "utf-8" /> <meta http-equiv = "X-UA-Compatible" cont

我正在尝试做一些类似的事情（背景图片封面全页） 我不知道为什么我的代码不起作用。也许这是html的问题，这就是为什么我删除了大部分代码来检查它，什么不起作用。这就是为什么我认为这是css的一个问题。但我不知道。这是我的密码

<!doctype html>
<html lang = "pl">
<head>
<meta charset = "utf-8" />

<meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" />

<!--<link rel = "stylesheet" type = "text/css" href = "style.css" /> -->

<style>
body {
margin: 0;
padding: 0;
height: 100%;
}

.clear{
clear:both;
}
#head{
/*https://pixabay.com/pl/users/Tama66-1032521/*/
background-image:url("railway.jpg");
background-position: center;
background-repeat: no-repeat;
background-size: cover;
height:100%;
}

#space1{
width:20%;
float:left;
}

</style>
</head>
<body>
<div id = "container">
<header>
<div id = "head">
<div id = "menu">

<div id = "space1">
</div>

<div id = "menulist">
<ol id = list>
<li><a href = "#"></a></li>
<li><a href = "#"></a></li>
<li><a href = "#"></a></li>
<li><a href = "#"></a></li>
</ol>
</div>

<div class = "clear">
</div>

</div>
</div>
</header>

</div>
</body>
</html>


身体{
保证金：0；
填充：0；
身高：100%；
}
.清楚{
明确：两者皆有；
}
#头{
/*https://pixabay.com/pl/users/Tama66-1032521/*/
背景图片：url（“railway.jpg”）；
背景位置：中心；
背景重复：无重复；
背景尺寸：封面；
身高：100%；
}
#空间1{
宽度：20%；
浮动：左；
}

  • 

  • 

  • 

  •
    }

    尝试将100%更改为100vh

    }

    尝试将100%更改为100vh…

    除了在
    主体上设置
    高度：100%
    ，您还需要添加此项
    

    html{height:100%}

    

    当您在任何元素上设置
    height:100%
    时，这意味着您要求该元素占据与父元素相同的高度。父元素需要显式指定一些高度。只有这样它才能工作（元素上的
    位置：绝对
    或
    位置：固定
    除外）。在这里，您没有在
    正文
    的父项
    html
    上指定
    高度
    。你可能会问，它自己的高度应该以谁的高度为基础。我没有答案。也许有人会看到这个问题的答案。
    除了在
    主体上设置
    高度：100%
    ，您还需要添加此选项
    

    html{height:100%}

    

    当您在任何元素上设置
    height:100%
    时，这意味着您要求该元素占据与父元素相同的高度。父元素需要显式指定一些高度。只有这样它才能工作（元素上的
    位置：绝对
    或
    位置：固定
    除外）。在这里，您没有在
    正文
    的父项
    html
    上指定
    高度
    。你可能会问，它自己的高度应该以谁的高度为基础。我没有答案。也许有人会看到这个问题的答案。
    如果使用100%作为高度，则必须将身体设置为最小高度100%、最大高度100%和高度100%。但是如果你在手机上或其他地方看网页，idk会确定它是否正常工作。。100 VH表示100视口高度，在每个设备上，图像将是设备高度的100%。如果使用100%作为高度，则必须将主体设置为最小高度100%，最大高度100%，高度设置为100%。但是如果你在手机上或其他地方看网页，idk会确定它是否正常工作。。100 VH表示100视口高度，在每个设备上，您的图像将是设备高度的100%。我正在按照你的指示重写它，从一开始它就工作了。所以我不知道为什么在以前的站点中有些东西不起作用。@Daniel1490您没有添加
    html{height:100%}
    Ok。我正在按照你的指示重写它，从一开始它就工作了。所以我不知道为什么在以前的站点中有些东西不起作用。@Daniel1490您没有添加
    html{height:100%}