Div不会出现

时间:2015-07-20 10:08:59

标签: html css

我正在尝试制作我的第一个网站,但我似乎无法创建我想象中的内容。 我无法让我的#invokeryolo div显示出来。我觉得完全没有意义,对于我的生活,我无法弄清楚什么是错的。这是我的代码:

HTML

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" type="text/css" href="dotoker1.css" />
  <title>Comprehensive guide to Invoker</title>
</head>
<body>
  <div id"invokeryolo"></div>
  <div id='contenttable'>
    <ol>
      <li><a href="#overview">Guide overview and hero introduction</a></li>
      <li><a href="#proscons">Pros and Cons</a></li>
      <li><a href="#spells">Spells</a></li>
      <li><a href="#earlymidlate">Early, mid and late game</a></li>
      <li><a href="#buildorder">Build order and situational items</a></li>
      <li><a href="#counter">Countering your counters</a></li>
    </ol>
  </div>
  <div class="content" id="overview"></div>
  <div class="content" id="proscons"></div>
  <div class="content" id="spells"></div>
  <div class="content" id="earlymidlate"></div>
  <div class="content" id="buildorder"></div>
  <div class="content" id="counter"></div>
</body>
</html>

CSS

html, body {
    background: url(http://dota2walls.com/wp-content/uploads/2014/11/invoker-arsenal-magus-wallpaper.png) no-repeat fixed;
    height: 100%;
}

#invokeryolo {
  background: url(http://image.blingee.com/images19/content/output/000/000/000/7df/820025845_2071037.gif);
  width: 60%;
  height: 200px;
  position:absolute;
  display: inline-block;
  border: 1px solid black;
}

#contenttable {
  width: 22%;
  height: 300px;
  display: inline-block;
}

ol {
  display:block;
  font-style: italic;
  color: #CCCC88;
  font-size: 130%;
  margin-right: 20px;
  background: rgba(0, 0, 0, 0.2);
  }

li {
  margin-bottom: 5px;
  background: rgba(0, 0, 0, 0.2);
  }

a {
  color: #CCCC88;
}

a:visited {
  color: #CCCC88;
}

.content {
  background: rgba(0, 0, 0, 0.2);
  width: 60%;
  height: 20%;
  margin-left: 23%;
  display: inline-block;
}

所有建议都表示赞赏。提前谢谢!

1 个答案:

答案 0 :(得分:6)

改变这个:

<div id"invokeryolo"></div>

到此:

<div id = "invokeryolo"></div>

您错过了=标志。