作业题,图中的nav有下拉菜单,如何做更适合。

来源:2-7 作业题

KongSunday

2018-10-12 17:19:09

http://img.mukewang.com/climg/5bc06577000165ef06760474.jpg

用bootstrap章节图中的nav,如何做更适合,用bootstrap给的模板上修改,

<ul class="nav navbar-nav">

                <li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>

                <li><a href="#">Link</a></li>

                <li class="dropdown">

                  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>

                  <ul class="dropdown-menu">

                    <li><a href="#">Action</a></li>

                    <li><a href="#">Another action</a></li>

                    <li><a href="#">Something else here</a></li>

                    <li role="separator" class="divider"></li>

                    <li><a href="#">Separated link</a></li>

                    <li role="separator" class="divider"></li>

                    <li><a href="#">One more separated link</a></li>

                  </ul>

                </li>

              </ul>

以上是模板的nav,感觉修改很麻烦,打算自己用一个比较好。

这个思路对吗?

写回答

2回答

妮可妮可妮_

2018-10-14

你好同学,Bootstrap包含了丰富的Web组件,他的优点就是可以根据它所包含的这些组件,快速的搭建一个漂亮、功能完备的网站。本次作业主要是为了练习 bootstrap的布局原理及使用方式,所以建议使用bootstrap来实现,样式是肯定需要修改的,在原样式上修改就可以了。

0
hongSunday
h 好的,谢谢各位!
h018-10-15
共3条回复

好帮手慕星星

2018-10-12

用bootstrap中的模板是比较简单的呢,因为bootstrap.js中已经有了点击事件的定义,并且在浏览器缩小之后,导航就变成了按钮了,也是bootstrap的模板。

http://img.mukewang.com/climg/5bc075700001327e08170604.jpg

修改下面的内容就可以了。

自己试一下。祝学习愉快~~

0
hongSunday
h 如果只修改你框的部分,还是会有很多不可控制的,例如鼠标经过二级菜单时,一级菜单的样式,进过一级菜单时,二级菜单样式,感觉要很复杂。
h018-10-12
共1条回复

0 学习 · 5012 问题

查看课程