如何使用Bootstrap中的btn-default设置按钮样式

 时间:2024-10-13 13:22:17

1、第一步,双击HBuilder开发工具,新建静态页面btn_default.html,如下图所示:

如何使用Bootstrap中的btn-default设置按钮样式

2、第二步,在<body></body>插入一个div,class值为罕铞泱殳contain髫潋啜缅er-fluid;再次插入一个div,class值为row,然后在第二个div中插入a标签,class值为btn btn-default,如下图所示:

如何使用Bootstrap中的btn-default设置按钮样式

3、第三步,保存代码并预览静态页面,查看到为原始标签内容,样式没有起到作用,如下图所示:

如何使用Bootstrap中的btn-default设置按钮样式

4、第四步,将a标签改为span标签,再次查看效果,结果发现还是一样的,如下图所示:

如何使用Bootstrap中的btn-default设置按钮样式

5、第五步,检查代码发现,由于Bootstrap相关的css文件没有引入,导致样式类不起作用;薪姚蟪食引入样式文件,如下图所示:

如何使用Bootstrap中的btn-default设置按钮样式

6、第六步,再次保存代码,查看页面效果,可以看到展示的是一个按钮,样式类起到作用了,如下图所示:

如何使用Bootstrap中的btn-default设置按钮样式
  • Visio如何设置容器样式
  • 怎么设置拖动对齐显示虚线
  • Word怎么插入重复内容控件?
  • 如何解决Qt5.10安卓编译套件缺失问题?
  • 设置QGIS界面为中文及加载墨卡托卫星影像地图
  • 热门搜索
    abab式的成语大全 描写方法有哪几种 快速减肥的最佳方法 核桃仁怎么吃 平行志愿是怎么录取的 豆腐炖鱼的家常做法 肾阳虚的治疗方法 煤气灶打不着火原因和处理方法 白癜风治疗方法 酷狗怎么k歌