1.已知:
• 布局分为:父元素A和N个子元素B;
• A宽度不固定:最小宽度为1000px,内部边距是32px
• B的宽度不固定:相邻两个B元素的间距是16px,所有B的宽度相同,边框为1像素,颜色为999
• 每行只能有3个B元素,超过的话需要换行;
• 最左侧B元素和最右侧的B元素,距离A的边缘都是32px;
你可以去试试呢 怎么写
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.Abox {min-width: 1000px;padding: 32px;padding-top: calc(32px - 16px);padding-left: calc(32px - 16px);background-color: pink;overflow: hidden;display: flex;flex-wrap: wrap;}.Bbox {width: calc(100% / 3 - 16px);padding-top: 20%;border: 1px solid #999;margin-left: 16px;margin-top: 16px;/* background-color: red; */box-sizing: border-box;/* float: left; */}</style>
</head><body><div class="Abox"><div class="Bbox"></div><div class="Bbox"></div><div class="Bbox"></div><div class="Bbox"></div><div class="Bbox"></div></div></body></html>