代码是否正确？一个疑问padding和margin边距重叠的话距离该怎么算

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

来源：3-24 编程练习

qq_命运_szFJMV

2018-11-07 23:48:41

<!DOCTYPE html>

<html>

<head>

<title>margin外边距</title>

* {

margin: 0;

padding: 0;

}

ul{

list-style:none;width:300px;height:400px;

background-color:pink;

padding-top:40px;

}

li{margin-left:40px;

width:200px;height:50px;background-color:yellow;

/*样式补充*/

}

</style>

</head>

<body>

<ul>

<li style="margin-top:40px;">JavaScript</li>

</ul>

</body>

</html>

写回答

2回答

妮可妮可妮_

2018-11-09

已采纳

你好同学:

padding是定义元素边框与元素内容之间的空间。ul内容是部分是从上图所示蓝色区域开始算起,所以当同学给第一个li标签的margin-top：80px;第一个li到顶部的距离就是80px+40px了

祝学习愉快!

妮可妮可妮_

2018-11-08

你好同学

测试了你的代码,可以实现效果

但是有些不是很理解同学提出的疑问,同学可以详细的在描述一下吗,如果描述不清楚,也可以通过上传代码或者截图来解释?老师也方便更高效准确的帮助你解答疑惑

祝学习愉快!

hq_命运_szFJMV

h 额，一开始我设第一个li标签的margin-top：80px;效果显示和示意图有偏差然后设了40px这里80px的距离是加上了ul{padding-top:40px;}的属性值了吗？

h018-11-08

共1条回复

0 学习 · 36712 问题

查看课程

相似问题

3-17编程练习怎么感觉和效果图不一样呢？

回答 2

关于<ul>和<li>内外边距的问题

回答 2

回答 3

垂直方向，两个相邻元素外边距会发生合并，那么

回答 2

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