我找不到css“height”不起作用的原因[重复]答案

【问题标题】：i don't find a reason why css "height" dosen't work [duplicate]我找不到css“height”不起作用的原因[重复]
【发布时间】：2018-10-30 23:49:08
【问题描述】：

好吧，我制作了一个用于网站的文件。你知道，我们有不同的设备（电脑，卖手机...）所以，我在 CSS 中使用了“重量”和“高度”和“%”（我认为，“px”不是一个好方法。）

“体重”无所谓，但“身高”有问题。 height 适用于“px”，但不适用于“%”

我猜，问题的原因是背景的高度，所以我解决了这个问题但是，它也没有奏效。所以，我修复了填充，边距，边框...... 但是，我没有找到解决方案。我不知道有什么问题，我该怎么办修复它：（

ps。我用括号

[这是 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


}

【问题讨论】：

欢迎来到 Stack Overflow！请澄清您的具体问题或添加其他详细信息以准确突出您的需求。正如目前所写的那样，很难准确地说出你在问什么。

标签： css html

【解决方案1】：

父元素需要一个高度值。将您的 html 和 body 设置为 100% 的高度。

如果父元素没有高度值，则子元素无法知道百分比的含义。 “什么的 40%？”

【讨论】：