<!doctype html> <html> <head> <metacharset="utf-8"> <metahttp-equiv="X-UA-Compatible"content="IE=edge"> <metaname="viewport"content="width=device-width, initial-scale=1"> <title>Bootstrap</title> <linkrel="stylesheet"href="css/bootstrap.css"rel="external nofollow"/> </head> <body> <divclass="container"style="margin-top:5px"> <divclass="row"> <divclass="col-lg-4"> <divclass="dropdown"><!--在dropdown后面加上open使下拉列表默认展开;而pull-right使其右浮动并右对齐,改为dropup使箭头朝上并向上展开--> <buttonclass="btn btn-default dropdown-toggle btn-block"data-toggle="dropdown">学院课程 <spanclass="caret"></span></button><!--btn-block使按钮撑满整个父级--> <ulclass="dropdown-menu"> <li><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">html</a></li> <li><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">css</a></li> <li><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">javascript</a></li> <li><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">less</a></li> <li><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">bootstrap</a></li> </ul> </div> </div> <divclass="col-lg-4"> <divclass="dropdown"> <buttonclass="btn btn-default dropdown-toggle"data-toggle="dropdown">学院课程 <spanclass="caret"></span></button> <ulclass="dropdown-menu"> <liclass="dropdown-header"><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">前端</a></li><!--dropdown-header是菜单里的标题,给li添加--> <li><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">html</a></li> <li><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">css</a></li> <li><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">javascript</a></li> <li><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">less</a></li> <li><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">bootstrap</a></li> <liclass="divider"><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">html</a></li><!--divider是分隔线,给li添加--> <liclass="dropdown-header text-center"><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">后端</a></li><!--text-center让内容居中--> <li><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">php</a></li> <li><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">java</a></li> <liclass="disabled"><ahref="#"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow"rel="external nofollow">.net</a></li><!--disabled使菜单不可选--> </ul> </div> </div> </div> </div> <scriptsrc="js/jquery-2.1.0.js"></script> <scriptsrc="js/bootstrap.js"></script> </body> </html> |