Rumah  >  Artikel  >  hujung hadapan web  >  bootstrap的原理是什么

bootstrap的原理是什么

藏色散人
藏色散人asal
2019-07-13 11:09:287740semak imbas

bootstrap的原理是什么

网格系统的实现原理,是通过定义容器大小,平分12份(也有平分成24份或32份,但12份是最常见的),再调整内外边距,最后结合媒体查询,就制作出了强大的响应式网格系统。Bootstrap框架中的网格系统就是将容器平分成12份。

bootstrap的原理是什么

bootstrap的实现原理

通过定义容器的大小,平分为12份(也有24份,23份的,取12份是一打,表示进阶完美的意思),再调整内外边距,最后结合媒体查询,制作出了强大的响应式网格系统。(可以通过重新编译LESS码源来修改12这个数值)。

1.数据行(.row)必须包含在容器(.container)中,以便赋予合适的对其方式和内边距(padding)。

2.在行(.row)中可以添加列(.column),但列数之和不能超过平分的总列数,比如:12.

3.通过设置内边距(padding)从而创建列于列之间的间距。然后通过为第一列和最后一列设置负值的外距(margin)来抵消内距(padding)的影响。

4.不希望相邻的两个列紧靠近在一起,就用offset功能来实现。

相关推荐:《bootstrap教程

Atas ialah kandungan terperinci bootstrap的原理是什么. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya:bootstrap怎么更改主题Artikel seterusnya:bootstrap为什么是12栅格