x
1
2
<html>3
<head>4
<meta charset="utf-8">5
<title>蜜蜂教程(mifengjc.com)</title>6
<style>7
#main {8
width: 200px;9
height: 150px;10
border: 1px solid #c3c3c3;11
display: flex;12
}13
14
#main div {15
width: 50px;16
height: 50px;17
}18
</style>19
</head>20
<body>21
22
<div id="main">23
<div style="background-color:coral;">A</div>24
<div style="background-color:lightblue;">B</div>25
<div style="background-color:khaki;">C</div>26
<div style="background-color:pink;">D</div>27
<div style="background-color:lightgrey;">E</div>28
<div style="background-color:lightgreen;">F</div>29
</div>30
<p>点击“尝试一下”按钮设置 flexWrap 属性的值为 "wrap"。</p>31
<button onclick="myFunction()">尝试一下</button>32
<script>33
function myFunction() {34
document.getElementById("main").style.flexWrap = "wrap";35
}36
</script>37
<p><b>注意：</b>Internet Explorer 和 Safari 不支持 flexWrap 属性。</p>38
39
</body>40
</html>