多个div垂直居中横向排列的示例分析

这篇文章给大家分享的是有关多个div垂直居中横向排列的示例分析的内容。小编觉得挺实用的，因此分享给大家做个参考，一起跟随小编过来看看吧。

创新互联-专业网站定制、快速模板网站建设、高性价比铁力网站开发、企业建站全套包干低至880元,成熟完善的模板库,直接使用。一站式铁力网站制作公司更省心,省钱,快速模板网站建设找我们，业务覆盖铁力地区。费用合理售后完善，十多年实体公司更值得信赖。

父级p，子级p高度都为自适应。

多个div垂直居中横向排列的示例分析

<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>垂直居中</title>
	<style>
		#mine {
			width: 500px;
			height:500px;
			background: #f00;
			margin: 0 auto;
			display: flex;
		}
		.center {
			/*flex: 1;*/
			/*width: 100px;
			height: 100px;*/
			background: #0f0;
			margin:auto;
		}
	</style>
</head>
<body>
	<p id="mine">
		<p class="center">一</p>
		<p class="center">二</p>
		<p class="center">三</p>
	</p>
</body>
</html>

感谢各位的阅读！关于“多个div垂直居中横向排列的示例分析”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，让大家可以学到更多知识，如果觉得文章不错，可以把它分享出去让更多的人看到吧！

分享题目：多个div垂直居中横向排列的示例分析
链接分享：https://www.cdcxhl.com/article38/jgscsp.html

成都网站建设公司_创新互联，为您提供商城网站、云服务器、响应式网站、微信小程序、网站策划、建站公司

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容