Navbar:导航栏

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

Navbar,导航栏 ..

导航栏的包装元素可以使用一下 nav, 上面要添加一个 navbar .. 里面可以先添加一个要在导航上显示的标志 .. 可以是一个 a 标签 .. 上面加上 navbar-brand .. 链接的文字是 ninghao

下面是导航栏里面的菜单 .. 可以用一个 ul 无序列表 .. 上面加上 navbar-nav ..

每个项目用一下 li ,上面加上 nav-item .. 列表里面是个链接 .. 一个 a 标签,上面加上 nav-link .. 再设置一下链接文字 .. 学习 ..

复制一份 .. 修改一下链接上的文字 .. 社区 ... 再复制一份 .. 这个是 博客 ..

然后去预览一下 ..

默认导航栏上的菜单项目会堆叠到一块儿显示 .. 我们可以再设置一下 .. 在导航栏的包装上,添加一个 navbar-expand-lg .. 这样在大尺寸的浏览窗口上面,会展开显示导航栏里的菜单 ..

如果你想在中等浏览窗口就展开 .. 可以用一下 navbar-expand-md

在这个包装上可以再设置一下导航栏的样式 .. 添加一个 navbar-light .. 导航栏里的文字颜色会发生变化 ..

再用一下 Bootstrap 里面的背景工具类 .. bg-light ... 它可以在元素上添加一个浅灰色的背景颜色 ...

Navbar:导航栏《 Bootstrap 4:界面组件 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点