Html 移动web应用的css放置图标

我正在尝试使用css为移动web应用程序放置图标。 然而，我对此有一些问题。 我设置了外盒，并将图标放在那个里，我认为这对不同的设备很好，因为它们有不同的尺寸

下面是我的代码，但我没有看到图标 我有什么遗漏吗

This is my html

<link rel="stylesheet" type="text/css" href="/mobile_pages/main/main_page.css"/>
<br>
<div id="siteMenu">
   <a href="/index.php?mid=s11" class="icon" id="intro_icon">  </a> 
   <a href="/index.php?mid=s15" class="icon" id="direction_icon">  </a> 
   <a href="/index.php?mid=s56" class="icon" id="pic_icon">  </a>    
   <a href="/index.php?mid=s21" class="icon" id="news_icon">  </a>    
   <a href="/index.php?mid=s31" class="icon" id="movie_icon">   </a> 
</div>

This is my css
#siteMenu{
  position: relative;
  width: device-width;
  height: device-height;

}

.icon{
  background-size: cover;
  width: 80px;
  height: 80px;
}

#intro_icon{
  position: absolute;
  background-image: url('intro_icon.png');
  top: 50px;
  left: 0px;
}

#direction_icon{
  position: absolute;
  background-image: url('direction_icon.png');
  top: 50px;
  left: 90px;
}


#pic_icon{
  position: absolute;
  background-image: url('pic_icon.png');
  top: 50px;
  left: 180px;
}

这是我的html


这是我的css
#网站菜单{
位置：相对位置；
宽度：设备宽度；
高度：设备高度；
}
.图标{
背景尺寸：封面；
宽度：80px；
高度：80px；
}
#介绍图标{
位置：绝对位置；
背景图片：url（'intro_icon.png'）；
顶部：50px；
左：0px；
}
#方向图标{
位置：绝对位置；
背景图片：url（'direction_icon.png'）；
顶部：50px；
左：90px；
}
#图片图标{
位置：绝对位置；
背景图片：url（'pic_icon.png'）；
顶部：50px；
左：180像素；
}

当我在#siteMenu中指定宽度和高度的特定像素时，我可以看到图标。 但是，我希望它是设备宽度和设备高度

我尝试了宽度和高度的100%自动值，但仍然不起作用。 我应该在这里做什么？

刚刚尝试了你的代码，带有谷歌徽标，工作正常

你能确保你的图标的路径是正确的，所以和你的CSS在同一个文件夹中吗

确保ccs文件被很好地引用，并且标记必须位于页面的标记中

#intro_icon{
  position: absolute;
  background-image: url('http://upload.wikimedia.org/wikipedia/commons/8/87/Google_Chrome_icon_(2011).png');
  top: 50px;
  left: 0px;
}

对于设备宽度和设备高度，它们是媒体查询参数，而不是css属性。您还需要设置html和正文标记完整页面：

html{   
  width: 100%;
  height: 100%;
}

body{
    min-height:100%;   
    padding:0px;margin:0px;
}

#siteMenu{
  position: relative;
  width: 100%;
  height: 100%;
  height: 100vh;
  min-height:100%;   
}

---

，请注意，并非所有浏览器（如IE8）都支持vh）

您可以发布布局的线条图吗？