Question

我正在尝试为我们的组织设计一个网站。在本网站中，我希望显示来自主页上特定内容区域的不同链接的内容。例如，假设用户点击“关于我们”链接然后在该特定内容区域中将显示“关于我们”的内容，并且也显示与其他链接相同的情况。默认情况下，将显示“Home”链接的内容。我不知道如何实现这一点....有人请帮助我！（我正在使用Bootstrap，Html和Css。如果还需要其他语言，请告知我。）谢谢大家。

<!DOCTYPE html>
<html lang="en">
<head>

        <meta charset="utf-8">

        <link type="text/css"  href="design.css" rel="stylesheet" />
        <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

</head>
<body>
        <div class="container-fluid">
            <nav class="navbar navbar-default navbar-fixed-top">

                <div class="row" >

                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">Some Text...</div>
                </div>
            <div class="row">

                <div class="col-md-1 col-lg-2" ></div>
                <div class="col-xs-12 col-sm-12 col-md-10 col-lg-8" >
                        <ul class="nav nav-tabs navbar-inverse">

                            <li><a href="#">Home</a></li>
                            <li><a href="#">About Us</a></li>
                            <li><a href="#">Mission</a></li> 
                        </ul>

                </div>
                <div class="col-md-1 col-lg-2" ></div>          
            </div>


        </nav>
    </div>
<div class="container-fluid">

            <div class="row">
                <div class="col-sm-3"></div>
                <div class="col-sm-6" ></div>
                <div class="col-sm-3"></div>
            </div>

            <div class="row">
                <div class="col-xs-12 col-sm-2 col-md-2 col-lg-2">
                    <button type="button" class="btn btn-primary">Home</button>
                    <button type="button" class="btn btn-primary">About Us</button>

                </div>
                <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8">Main Content Area</div>
                <div class="col-xs-12 col-sm-2 col-md-2 col-lg-2"></div>

            </div>
</div>

我希望根据第二个div中的用户选择显示链接的所有内容（从下面开始）。

Answer 1

在bootstrap中你可以设置class＆＃34; btn＆＃34;在标签＆＃34; a＆＃34;获得相同风格的按钮

<a href="#aboutus" class="btn btn-primary">About Us</a>

要显示链接的内容，您需要设置一个＆＃34; id＆＃34;标签＆＃34; div＆＃34;标签＆＃34; a＆＃34;设置＆＃34; id＆＃34;的名称在＆＃34; href =＃aboutus＆＃34;例如：

<div id="aboutus">
 <!-- content -->
</div>
<a href="#aboutus" class="btn btn-primary">About Us</a>

如何在主页

1 个答案: