以下代码求大神帮忙解答下
head部分我设置了line-height:100px(为元素高），为什么文字部分没有实现垂直居中呢？
img之前以及img和footer之间一直有空隙是怎么回事呢？开始已经设置了margin，padding均为0
最后的footer部分，我试着去ul或者footer里面添加 text-align，为什么达不到文字水平居中效果呢？我要怎么设置才正确呢？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
body,div,img{margin:0;padding:0;font-family:"微软雅黑";}
a{text-decoration:none;color:white;}
.head{width:100%;height:100px;background-color:black;line-height:100px;position:fixed;overflow:hidden;margin:0;}
.head img{float:left;}
.head ul{float:right;}
.head ul li{list-style:none;color:white;font-weight:bold;float:left;margin-right:40px;}
.content{padding-top:100px;}
.footer{width:100%;height:120px;background-color:gray;line-height:120px;text-align:center;}
.footer ul li{list-style:none;float:left;padding-right:10px;}
</style>
</head>
<body>
<div class="head">
<div><img src="http://climg.mukewang.com/58c0d2d900016ce303000100.png"/></div>
<div>
<ul>
<li><a href="#">课程</a></li>
<li><a href="#">职业路径</a></li>
<li><a href="#">实战</a></li>
<li><a href="#">猿问</a></li>
<li><a href="#">手记</a></li>
</ul>
</div>
</div>
<div class="content">
<div><img src="http://climg.mukewang.com/58c0eda50001e12416000480.jpg"/></div>
<div><img src="http://climg.mukewang.com/58c0edb80001c9f216000480.jpg"/></div>
</div>
<div class="footer">
<ul>
<li><a href="#">网站首页</a></li>
<li><a href="#">企业合作</a></li>
<li><a href="#">人才招聘</a></li>
<li><a href="#">联系我们</a></li>
<li><a href="#">常见问题</a></li>
<li><a href="#">友情链接</a></li>
</div>
</body>
</html>
慕尼黑47570192回答
-
慕斯卡3549274
把img的边框设为0 -
躺在草地看天空
把ul的margin设置为0，可以解决。
随时随地看视频慕课网APP
Html/CSS