发表于： 2018-09-12 23:49:50
1 693
今天完成的事情：
看了bootstrap4,大概了解了栅格布局。
尝试了使用bootstrap进行导航栏的布局：
简单的水平导航
如果你想创建一个简单的水平导航栏，可以在 <ul> 元素上添加 .nav类，在每个 <li> 选项上添加 .nav-item 类，在每个链接上添加 .nav-link 类。
导航对齐方式
导航默认左对齐，我们可以使用.justify-content-center 类设置导航居中显示， .justify-content-end 类设置导航右对齐。
垂直导航
.flex-column 类用于创建垂直导航：
选项卡
使用 .nav-tabs 类可以将导航转化为选项卡。然后对于选中的选项使用 .active 类来标记。
动态选项卡
如果你要设置选项卡是动态可切换的，可以在每个链接上添加 data-toggle="tab" 属性。 然后在每个选项对应的内容的上添加 .tab-pane 类。
胶囊状动态选项卡
胶囊状动态选项卡只需要将以上实例的代码中 data-toggle 属性设置为 data-toggle="pill":
明天计划的事情：
学习bootstrap4的导航栏布局，完成导航栏。
遇到的困难：
bootstrap4的组件功能看不懂...............................
收获：
通过学习任务8相关资料，了解了框架的作用。
返回列表
评论