Question

嘿伙计们我试图在div标签中设置背景颜色，但是没有发生任何事情。我觉得我的div中有一个浮动元素，但是我没有办法解决它。

HTML

<div id='footer'>
      <h5>©Krish International Inc.
      </h5>
    </div>

CSS

   #footer {
        background-color: deepskyblue;
      }
 h5 {
    font-weight: normal;
    position: absolute;
    width: 100%;
    text-align: center;
    font-size: 30px;
    font-family: 'hind';
@font-face {
    font-family: 'hind';
    src: url('C:/Users/lakes/Desktop/hind2.ttf')
  }

Answer 1

当你通过以下方法获得它时，为什么要使用position:absolute;。

如果您需要使用position，那么父div在默认情况下不会获得高度，直到您不给予为止。因为当我们使用position: absolute div或标签时，流出来了。

＆＃13;

  #footer {
  background-color: deepskyblue;
  width: 100%;
}

h5 {
  font-weight: normal;
  /* position: absolute; */
  width: 100%;
  display: block;
  text-align: center;
  font-size: 30px;
  font-family: 'hind';
  @font-face {
    font-family: 'hind';
    src: url('C:/Users/lakes/Desktop/hind2.ttf')
  }

＆＃13;

<div id='footer'>
  <h5>©Krish International Inc.
  </h5>
</div>

＆＃13;

Answer 2

关于position:absolute：

设置为绝对值或固定后，元素完全从正常流动中移除文档。

<强>原因：

h2位置absolute已从文档的正常流程中完全删除，#footer获取height:0

<强>修正：

您必须为height定义min-height或#footer。

 #footer {
        background-color: deepskyblue;
        height: 100px;<------------Added
       //Or min-height:100px;
}

＆＃13;

 #footer {
        background-color: deepskyblue;;
        height: 100px;
  }

 h5 {
    font-weight: normal;
    position: absolute;
    width: 100%;
    text-align: center;
    font-size: 30px;
    font-family: 'hind';
  }

@font-face {
    font-family: 'hind';
    src: url('C:/Users/lakes/Desktop/hind2.ttf')
  }

＆＃13;

  <div id="footer">
      <h5>©Krish International Inc.
      </h5>
    </div>

＆＃13;

无法在页脚中设置背景颜色

2 个答案: