<分区>
<分区>
好吧，我制作了一个将用于网站的文件。 你知道，我们有不同的设备(pc，手机销售......)所以，我在 CSS 中使用了“weight”和“height”和“%”(我认为，“px”不是一个好方法。)
“体重”无所谓，但“高度”有问题。 高度适用于“px”，但不适用于“%”
我猜，问题的原因是背景的高度，所以我修复了 但是，它也没有用。所以，我修复了填充、边距、边框...... 但是，我没有找到解决方案。我不知道什么是问题，我怎么能 修复它:(
附言。我用括号
[这是 HTML5 代码]
<!doctype html>
<html>
<head>
<title>PIZZAchoice</title>
<link rel="stylesheet" href="ChoicePizza.css">
<meta charset="utf-8">
</head>
<body>
<div class="company">
i am tech
</div>
<div class ="cho1">
<p></p>
</div>
<div class ="cho2">
<p></p>
</div>
<div class ="cho3">
<p></p>
</div>
<div class ="cho4">
<p></p>
</div>
<div class = "next">
next
</div>
</body>
</html>
[这是 CSS 代码]
.company{
padding: 1px;
width: 150px;
margin-left:2px;
font-size: xx-large;
font-weight: 600;
color: yellow;
}
.cho1, .cho2, .cho3, .cho4 {
padding: 1px;
width: 24%;
height: 40%;
margin-top: 10px;
margin-left: 2px;
margin-right: 2px;
float:left;
border-style:ridge;
border-color:saddlebrown;
border-width:3px;
}
.cho1
{
background-image: url('치즈피자.jpg');
background-size: 200%;
background-repeat:no-repeat;
}
.cho2
{
background-image: url('야채피자.jpg');
background-size: 207%;
background-repeat:no-repeat;
}
.cho3
{
background-image: url('시카고피자.jpg');
background-size: 206%;
background-repeat:no-repeat;
}
.cho4
{
background-image: url('프리슈또.jpg');
background-size:
background-repeat:no-repeat;
}
.next{
padding: 1px;
width: 100px;
height: 50px;
border-style:ridge;
border-color:whitesmoke;
border-width:2px;
position: absolute;
top: 90%;
left: 92%;
text-align : center;
font-size: xx-large;
font-weight: 600;
background-color: orangered;
color:white;
}
body{
background-image: url('선택배경.jpg');
background-size: 100%;
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center
}
最佳答案
父元素需要一个高度值。给你的 html 和 body 一个 100% 的高度。
如果父元素没有高度值，子元素就无法知道百分比的含义。 “什么的 40%？”
关于css - 我找不到 css "height"不起作用的原因，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53068043/