简单教程
提交运行
代码编辑器:
<meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="/static/lib/bootstrap/4.0.0/css/bootstrap.min.css"> <script src="/static/lib/jquery/3.3.1/jquery.min.js"></script> <script src="/static/lib/bootstrap/4.0.0/js/bootstrap.min.js"></script> <div class="container"> <h2>按钮组大小</h2> <p>.btn-group-lg|sm|xs 可以设置按钮组的大小</p> <h3>大按钮</h3> <div class="btn-group btn-group-lg"> <button type="button" class="btn btn-primary">Python</button> <button type="button" class="btn btn-primary">PHP</button> <button type="button" class="btn btn-primary">Perl</button> </div> <h3>默认按钮</h3> <div class="btn-group"> <button type="button" class="btn btn-primary">Python</button> <button type="button" class="btn btn-primary">PHP</button> <button type="button" class="btn btn-primary">Perl</button> </div> <h3>小按钮</h3> <div class="btn-group btn-group-sm"> <button type="button" class="btn btn-primary">Python</button> <button type="button" class="btn btn-primary">PHP</button> <button type="button" class="btn btn-primary">Perl</button> </div> </div>
运行结果: