为了账号安全,请及时绑定邮箱和手机立即绑定

以下代码求大神帮忙解答下

以下代码求大神帮忙解答下

慕尼黑4757019 2018-07-28 12:09:51
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>
查看完整描述

2 回答

?
慕斯卡3549274

TA贡献1条经验 获得超1个赞

把img的边框设为0

查看完整回答
1 反对 回复 2018-07-28
?
躺在草地看天空

TA贡献10条经验 获得超1个赞

把ul的margin设置为0,可以解决。


查看完整回答
1 反对 回复 2018-07-28
  • 2 回答
  • 0 关注
  • 948 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信