Bootstrap是一款流行的前端框架，提供了丰富的样式和组件。在Bootstrap V4版本中，有很多常用的样式可以帮助我们快速搭建一个美观、响应式的网站或应用程序。本文将介绍一些Bootstrap V4中常用的样式。
常用样式
文本
Bootstrap提供了许多文本样式，通过添加相应的类名即可进行调用。以下是一些常用的文本样式：
– .text-primary：设置文本颜色为主题颜色；
– .text-muted：设置文本颜色为灰色；
– .text-center：设置文本居中显示。
背景
除了常规的背景色，Bootstrap还提供了许多背景图样式。以下是一些常用的背景样式：
– .bg-primary：设置背景颜色为主题颜色；
– .bg-dark：设置背景颜色为深色；
– .bg-light：设置背景颜色为浅色；
– .bg-image：设置背景为图片。
按钮
Bootstrap中的按钮是用来触发操作的，如提交表单、打开链接等。以下是一些常用的按钮样式：
– .btn-primary：设置按钮颜色为主题颜色；
– .btn-outline-primary：设置按钮边框颜色为主题颜色；
– .btn-block：使按钮占据整个父级元素的宽度。
图片
Bootstrap中的图片样式可以帮助我们在网站或应用程序中展示图片。以下是一些常用的图片样式：
– .rounded：使图片的四个角变成圆角；
– .img-fluid：使图片自适应父级容器大小，保持比例不变；
– .figure：将图片嵌套在.figure类中，使其具有图文结合的效果。
布局
容器
Bootstrap中的容器是用来控制页面内容的宽度和垂直偏移的。以下是一些常用的容器样式：
– .container：设置固定宽度的容器，宽度随着屏幕尺寸的变化调整；
– .container-fluid：设置全屏宽度的容器。
栅格系统
Bootstrap的栅格系统是用来创建响应式布局的，通过将屏幕分成12列，我们可以轻松地实现各种布局效果。以下是一些常用的栅格样式：
– .row：创建行，并将每行分成12列；
– .col-*：设置列的宽度，*代表1~12的数字；
– .offset-*：设置偏移，*代表1~12的数字。
小结
Bootstrap V4提供了许多常用的样式和组件，本文介绍了一些常用的样式。在使用时，建议根据具体情况选择相应的类，以避免过多的样式冗余。如果需要更多的样式或组件，请参考Bootstrap的官方文档。
