Bootstrap中导航和下拉列表

最新推荐文章于 2024-06-04 08:58:47 发布

#清词#

最新推荐文章于 2024-06-04 08:58:47 发布

阅读量1.9k

点赞数

分类专栏：笔记文章标签： bootstrap 前端 html

本文链接：https://blog.csdn.net/qq_54998648/article/details/124973378

版权

一、栅格系统

栅格系统：在容器（container）中放置若干个行（row），每行分为12col（列）进行布局。类似于表格；栅格系统不是以往的流体布局，而是弹性布局，采用[display：flex；sizing-box：border-box]。

二、bootstrap之下拉列表

Bootstrap的下拉列表可以通过给外部div添加CSS类[class=“dropdown”]，button添加CSS类[class=“dropdown-toggle”]和属性[data-toggle=”dropdown”]，ul添加CSS类[class=“dropdown-menu”]完成。如果想实现下拉列表，必须要导入jQuery.js和bootstrap.js文件。详情见案例源代码>>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>下拉菜单</title>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
		<script src="js/jQueryv3.5.1.js" typ