为什么我父级所占的大小和视频里老师的不一样
来源：3-11 align-items属性
qq_Lcy_6
2019-03-17 17:32:48
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>3-1 display属性</title>
<link rel="stylesheet" type="text/css" href="css/reset.css">
<style type="text/css">
.flex-container{
display:flex;
align-items:stretch;
height:150px;
}
.flex-item{
}
.flex-item:nth-child(1){
font-size:18px;
background:yellow;
}
.flex-item:nth-child(2){
font-size:24px;
background:green;
}
.flex-item:nth-child(3){
font-size:30px;
background:pink;
}
.flex-item:nth-child(4){
font-size:14px;
background:red;
}
</style>
</head>
<body>
<div class="flex-container">
<div class="flex-item ">A</div>
<div class="flex-item ">B</div>
<div class="flex-item ">C</div>
<div class="flex-item ">D</div>
</div>
</body>
</html>
我的是周围有空，而老师的就没有
写回答
2回答
-
好帮手慕星星
2019-03-18
你好，这边测试确实是没有问题的：
同学可以在控制台中看一下body标签是否还有外边距：
如果还是有问题，建议将reset.css代码粘贴上来，老师帮助你测试下。
或者将reset.css样式粘贴在html文件中进行测试，不引入外部链接，看看有没有问题。
0 -
好帮手慕星星
2019-03-18
你好，这个空隙应该是body标签默认有8px的外边距，可以给body清除一下：
代码中引入了reset.css文件，
不知道你引入的路径是否正确，或者这个文件中是否清除了默认的外边距。
自己可以检查一下哦。
祝学习愉快！欢迎采纳~
0h019-03-18
相似问题