请老师检查

首页课程实战体系课手记专栏慕课教程

请老师检查

来源：2-2 编程练习

慕函数4234673

2019-11-09 10:18:57

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>CSS布局</title>

<style type="text/css">

*{

margin: 0;

padding:0;

}

.header{width:100%;

height:100px;

background-color:white;

overflow:hidden;

}

.header .logo{width:300px;

height:60px;

float:left;

margin-left:30px;

margin-top:10px;

}

.header .logo img{text-align:center;

line-height:100px;

}

.header .header2{float:right;

height:100px;

}

.header .header2 ul {margin-left:20px;}

.header .header2 ul li{float:left;

line-height:100px;

height:100px;

text-align:center;

margin-right:20px;

list-style:none;

}

</style>

</head>

<body>

<div class="header">

<div class="logo"><img src="http://climg.mukewang.com/595dd5120001736902000080.png"></div>

<div class="header2">

<ul>

<li>前端</li>

<li>后端</li>

<li>移动端</li>

<li>数据库</li>

</ul>

</div>

</div>

</body>

</html>

写回答

1回答

好帮手慕慕子

好帮手慕慕子

2019-11-09

同学你好，整体效果实现了

不过检查元素可以发现，左侧logo盒子的高度小于图片实际的高度，导致无法完整包裹图片

建议优化：调整图片和外层盒子的高度一致，让代码更加规范

如果帮助到了你，欢迎采纳，祝学习愉快~~~~

0

0 学习 · 40143 问题

相似问题

请老师检查

回答 1

请老师检查

回答 1

老师帮忙检查下，怎么下移这么多哦？

回答 3

请老师检查！

回答 3

老师请检查

回答 3

打开慕课网App查看更多内容