<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>task1-section2</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<!-- 头部导航 -->
<header>
<a href="#"><img src="images/ms.png" alt="MicroSoft"></a>
</header>
<!-- 主体内容 -->
<!-- 底部版权 -->
<footer>
<p>版权所有®</p>
</footer>
</body>
</html>
---------------------------------------------------------------
*{
padding: 0;
margin: 0;
background-color: #ccc;
}
/*头部导航*/
header{
background-color: #fff;
}
header a{
text-decoration: none;
height: 0px;
background-color: #fff;/*添加后可消除*/
}
问题依旧有效,目前我只能设置a连接的背景颜色和header颜色相同才能解决。
无法消除,实际还是存在,只是用颜色覆盖而已。
希望能有人能用别的方法来解决,虚心接受。
-----------------------3/24-------
刚才在做其他页面,找资料时刚好碰到原因了
图片默认的vertical-align是baseline,
可以设置vertical-align:middle,我则是直接设置img{display:block;}
感谢各位。
贴个链接:http://jingyan.baidu.com/article/7082dc1c69dc6fe40a89bdfe.html
img{display: block;}
正如前面的朋友所说,img是inline元素,把img转换为block块元素就可以了
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。