Bootrap中设置列宽、列的拆分、列的排序和偏移、网格类的混合应用

最新推荐文章于 2023-05-05 16:25:05 发布

古雅学长

最新推荐文章于 2023-05-05 16:25:05 发布

阅读量286

点赞数 1

分类专栏： Bootstrap

本文链接：https://blog.csdn.net/qq_46179813/article/details/105544821

版权

本文详细介绍了在Bootstrap中如何设置列宽，包括自动和手动拆分列，以及响应式的拆分策略。同时讲解了列的排序和偏移方法，最后探讨了网格类在不同设备类型的混合应用案例。

摘要由CSDN通过智能技术生成

一、设置列宽

1、列宽的设置

1、平均分配列
	.col,.col-sm,.col-md,.col-lg,.col-xl
2、指定列的宽度，.col-sm-*,.col-md-*,col-lg-*,.col-xl-*
	-sm-576px,-md-768px,-lg-992px,-xl-1200px
3、列宽自适应内容
	.clo-atuo,.col-sm-auto,.col-md-auto,.col-lg-auto,.col-xl-auto
<div class="container">
		<div class="row">
			<div class="col border">	1</div>
			<div class="col-auto border">	内容过多</div>
			<div class="col border">	3</div>
		</div>	
	</div>