CSS3複数列のレイアウトの列

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			* {
				margin: 0;
				padding: 0;
			}
			
			.wrap {
				width: 400px;
				border: 1px solid;
				margin: 100px auto;
				/*栏目宽度*/
				/*column-width: 100px;*/
				/*栏目个数*/
				column-count: 4;
				/*栏目间距*/
				column-gap: 50px;
				/*栏目分割线*/
				column-rule: dashed;
			}
		</style>
	</head>

	<body>
		<div class="wrap">
前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页。</br>
前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页。</br>
前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页。</br>
前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页。</br>
前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页。</br>
前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页。</br>
前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页。</br>
前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页。</br>
前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页。</br>
前端即网站前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页。</br>
		</div>
	</body>

</html>
公開された46元の記事 ウォン称賛7 ビュー30000 +

おすすめ

転載: blog.csdn.net/OldStreet61/article/details/104372951