为什么我的a标签可以设置margin-top？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>IMOOC</title>
<style>
*{padding:0;margin:0;font-family:"微软雅黑";color:white;}
a{text-decoration:none;font-size:20px;}
header{background-color:black;width:1200px;height:80px;}
.container{margin:0 auto;height:80px;width:1000px;line-height:80px;}
.container > a{float:left;padding-left:20px;box-sizing:border-box;font-size:24px;margin-top:15px;}
nav{float:right;height:70px;}
nav > a{display:block;line-height:70px;float:left;width:100px;text-align:center;}
nav > .home{background:red;}
nav > .course{background:yellow;}
nav > .actual{background:green;}
nav > .plan{background:purple;}
nav > .faq{background:orange;}
nav > .notes{background:blue;}
nav a:hover,nav > a.active{padding-bottom:10px;}
</style>
</head>
<body>
<!-- 在此完成网页的HTML代码-->
<header>
<div class="container">
<a href="#"><img src="http://img1.sycdn.imooc.com/climg//582e5f160001b17100400040.png"/>MYMOOC</a>
<nav>
<a class="home active" href="#">HOME</a>
<a class="course" href="#">COURSE</a>
<a class="actual" href="#">ACTUAL</a>
<a class="plan" href="#">PLAN</a>
<a class="faq" href="#">FAQ</a>
<a class="notes" href="#">NOTES</a>
</nav>
</div>
</header>
</body>
</html>在.container > a里我设置了margin-top是有效果的，但不是说行标签只能设置margin左右而不能设置上下嘛，为什么我这就可以呢
0
收起
正在回答
2回答
同学你好， 因为你给container下的a标签设置左浮动了， 浮动元素的display属性表现为block哦。
可以通过控制台检查元素 ，如下图所示:
建议： 可以给logo图片设置上外边距， 实现图片和上方的距离， 另， 也可以给图片设置左浮动， 让整体效果实现更好哦
效果图：
如果帮助到了你， 欢迎采纳！
祝学习愉快~~~
weixin_慕设计7122316
2019-08-13 11:29:34
代码里面已经将a标签转成块级元素了。 display:block
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星