Bootstrap之侧边导航菜单(可折叠分组)

devcjq 2021-09-08 原文

<!DOCTYPE html>
<html lang="zh-CN">

    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
        <title>表格</title>

这3个meta标签是什么意思？

全文：http://blog.csdn.net/shangmingchao/article/details/49763351

附：

Bootstrap学习——折叠效果

其中learn more按钮的代码：

<p>
<a href=“#learn-more-content” class=“btn btn-primary btn-large” data-toggle=“collapse”>Learn more ?</a>
</p>

下面文字部分的代码：

<div id=“learn-more-content” class=“collapse” style=“height:0px;“>
<p>this is a template for a simple marketing or informational website.It includes a large callout called the hero unit and three supporting pieces of content.Use it as a starting point to create something more unique.</p>
</div>

在learn more所属的元素<a>标签上添加data-toggle和data-target两个属性，其中data-toggle属性值为collapse表示该元素要实现折叠效果，data-target属性值表示要折叠的目标。这里就是下面id为”learn-more-content”部分的文字内容。

如果想折叠元素默认是打开的，则可以设置被折叠元素（这里就是id=“learn-more-content”的div元素啦）的class=”in”或者class=”collapse” style=”height:auto;”就好了。

出自：http://blog.163.com/zhi_qingfang@126/blog/static/11747756320135613715378/