我的问题是: 1)“房子”图像没有覆盖 block ，而是将自己夹在中间.. 2) 有两个 block ，即使我的代码没有列出两个..
HTML 文档:
<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="home_page_stylesheet.css">
</head>
<body>
<div>
<a href="http://www.webapp.com/home">
<img src="/Users/<<>>/Desktop/web_app/images/icons/home_icon_selected.png"/>
</a>
</div>
</body>
CSS 文档:
* {
background-color: #EAE4C5;
}
div {
border: 1px solid white;
border-radius: 5px;
height: 50px;
width: 50px;
background-color: white;
text-align: center;
display: inline-block;
}
我最终得到的是:
最佳答案
改为将主页图标用作 div 的背景。
这可以使用以下 CSS 代码来完成。更新图像的文件路径。
background-image: url('home_icon_selected.png');
为了让整个div都可以点击，你应该把a标签包裹起来，如下代码:
<a href="http://www.webapp.com/home">
<div>
</div>
</a>
考虑为您的 div 添加一个类标识符，这样您的代码中就可以有多个不同的 div。
关于html - 为什么有两个 block ？为什么图像没有覆盖 block ？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23920432/