CSS控制一行显示两个li

效果

代码

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<style type="text/css">
	ul {
		width: 300px;
	}
	li {
		width: 150px;
		float: left;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	label {
		margin-right: 10px;
	}

</style>
<body>
	<ul class="a">
		<li class="b"><label>你好</label><p>111</p></li>
		<li class="b"><label>你好1</label><p>111</p></li>
		<li class="b"><label>你好</label><p>111</p></li>
		<li class="b"><label>你好2</label><p>111</p></li>
		<li class="b"><label>你好</label><p>111</p></li>
		<li class="b"><label>你好3</label><p>111</p></li>
	</ul>
</body>
</html>
posted @ 2020-03-15 16:03  Nayek  阅读(2545)  评论(0)  编辑  收藏  举报