Bootstrap4："col-12“在手机屏幕上还是太宽了，如何换行？

在手机屏幕上，如果"col-12"在水平方向上太宽了，可以使用Bootstrap4提供的响应式类来实现换行。具体做法是将"col-12"替换为"col-12 col-md-6"，这样在手机屏幕上会自动换行显示为两列。

解释： Bootstrap是一种流行的前端开发框架，提供了丰富的CSS和JavaScript组件，用于快速构建响应式、移动优先的网页设计。其中的网格系统可以帮助开发者实现灵活的布局。

在Bootstrap4中，网格系统使用了"col-"类来定义列的宽度，其中""表示列所占据的网格数。例如，"col-12"表示该列占据整个网格的12份，即占据整个宽度。

然而，在手机屏幕上，"col-12"可能会显得太宽，导致内容无法完整显示。为了解决这个问题，可以使用响应式类来调整列的宽度。在上述例子中，使用了"col-12 col-md-6"，表示在手机屏幕上占据整个宽度，而在中等屏幕（md）及以上的设备上，占据一半的宽度。这样就可以实现在手机屏幕上的换行效果，使内容更好地适应不同屏幕大小。

推荐的腾讯云相关产品和产品介绍链接地址：

• 腾讯云主页：https://cloud.tencent.com/
• 云服务器（CVM）：https://cloud.tencent.com/product/cvm
• 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
• 云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
• 云存储（COS）：https://cloud.tencent.com/product/cos
• 腾讯云区块链服务（TBC）：https://cloud.tencent.com/product/tbc