推荐：bootstrap4中常用的样式介绍

进度条

progress  //添加一个p
progress-bar //在上面的p中添加一个progress-bar的p
分页
pagination //ul元素上添加
page-item //在li元素上添加page-item
列表组
list-group //列表组
list-group-item //列表li
list-group-item-action
卡片
card、card-header、card-body、card-footer
card-img-top //图片
card-body、card-title、card-text //图片卡片
card-img-overlay//设置图片为背景
下拉菜单
dropdown //下拉菜单默认
button设置dropdown-toggle   data-toggle=“dropdown” //下拉button
dropdown-menu //下拉菜单
a设置样式dropdown-item
导航栏
navbar、navbar-expand-sm、bg-light
ul：navbar-nav li：nav-item
表单
form-group
label for email
input class form-control
模态框
button设置 data-toggle="modal" data-target="#myModal"
<div class="modal fade" id="myModal"></div>
<div class="modal-dialog"></div>
<div class="modal-content"></div>
 <div class="modal-header">
        <h4 class="modal-title">模态框头部</h4>
        <button type="button" class="close" data-dismiss="modal">&times;</button>
      </div>
<div class="modal-body">模态框内容..</div>
<div class="modal-footer"><button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button></div>
提示框
data-toggle="tooltip" //创建提示框
title="我是提示内容!" //提示内容
data-placement="top" //指定提示框位置
$(document).ready(function(){    //初始化
$('[data-toggle="tooltip"]').tooltip(); 
});
以上就是推荐：bootstrap4中常用的样式介绍的详细内容，更多请关注php中文网其它相关文章！
				
				

					
微信
					
分享
				

网站建设是一个广义的术语，涵盖了许多不同的技能和学科中所使用的生产和维护的网站。



  
关键词：推荐：bootstrap4中常用的样式介绍