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>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM