要获取网格断点值，我们可以使用bootstrap的display属性。使用响应显示实用程序类更改display属性的值。您可以根据需要组合课程，以产生不同的影响。
- .d- {value} for xs
- .d- {breakpoint}-{value}用于xl，lg，md和sm。
这里的值可以是其中之一，如none，inline，inline-block，block，table，table-cell，table-row，flex，inline-flex。
媒体查询会影响具有给定断点或更大断点的屏幕宽度。例如， .d-md-none设置显示：无；在md，lg和xl屏幕上。
网格断点是
- xs：<576px额外的小工具(纵向手机，小于576px)。
- sm：> = 576px的小工具(横向手机，576px及以上)。
- md：> = 768px中型小工具(平板电脑，768px及以上)。
- lg：> = 992px大型小工具(台式机，992px及以上)。
- xl：> = 1200px特大小工具(大型台式机，1200px及以上)。
要掩盖组件，请针对任何响应屏幕使用.d-none类或.d- {sm，md，lg，xl} -none类之一。
要以给定的屏幕尺寸间隔显示组件，则可以将一个.d-*-none类与.d-*-*类组合在一起，以用于说明.d-none .d-md-block .d-xl-none将覆盖所有屏幕尺寸的组件，但中型和大型小工具除外。
范例1：
HTML
bootstrap4 | grid-breakpoint
GeeksforGeeks
Visible on all screen-size
Only Visible on xs (less
than 576px) screen-size
Only Visible on sm (767px to
576px) screen-size
Only Visible on md (991px
to 768px) screen-size
Only Visible on lg (1199px
to 992px) screen-size
Only Visible on xl (>=1200px)
screen-size
HTML
Bootstrap4 grid-breakpoint
GeeksforGeeks
Visible on all screen-size
Hidden on xs (less than
576px) screen-size
Hidden on sm (767px and
less) screen-size
Hidden on md (991px and
less) screen-size
Hidden on lg (1199px and
less) screen-size
Hidden only on xl (1200px
and up) screen-size
输出：
范例2：
的HTML
Bootstrap4 grid-breakpoint
GeeksforGeeks
Visible on all screen-size
Hidden on xs (less than
576px) screen-size
Hidden on sm (767px and
less) screen-size
Hidden on md (991px and
less) screen-size
Hidden on lg (1199px and
less) screen-size
Hidden only on xl (1200px
and up) screen-size
输出：
