灰度主题框阴影

时间:2015-10-07 11:39:57

标签: html css html5 twitter-bootstrap

我正在使用名为Greyscale的引导主题。我在整个页面上应用了一个盒子阴影时遇到了麻烦,效果只是应用在顶部。

这很奇怪,因为我可以为整个页面应用宽度。

我的模板:

<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document sans titre</title>
<link href="../css/bootstrap.css" rel="stylesheet" type="text/css">
<link href="../css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="../css/template.css" rel="stylesheet" type="text/css">
<link href="../css/body_template.css" rel="stylesheet" type="text/css">
<!--<script type="text/javascript" src="../js/navbar.js"></script>-->
    <!-- jQuery -->
    <script src="../js/jquery.js"></script>

    <!-- Bootstrap Core JavaScript -->
    <script src="../js/bootstrap.min.js"></script>

    <!-- Plugin JavaScript -->
    <script src="../js/jquery.easing.min.js"></script>

    <!-- Custom Theme JavaScript -->
<script src="../js/grayscale.js"></script>
</head>
<body>

<div id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">

    <!-- Navigation -->
    <nav class="navbar navbar-custom navbar-fixed-top" role="navigation">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-main-collapse">
                    <i class="fa fa-bars"></i>
                </button>
                <a class="navbar-brand page-scroll" href="#page-top"> <em class="fa fa-home"></em> <span class="light">Nos </span> Voyages </a></div>

            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse navbar-right navbar-main-collapse">
                <ul class="nav navbar-nav">
                    <!-- Hidden li included to remove active class from about link when scrolled up past about section -->
                    <li class="hidden">
                        <a href="#page-top"></a>
                    </li>
                    <li>
                        <a class="page-scroll" href="#about">About</a>
                    </li>
                    <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">toogle<span class="caret"></span></a>
                      <ul class="dropdown-menu">
                        <li><a href="#download">item1</a></li>
                        <li class="divider"></li>
                        <li><a href="#">item2</a></li>
                        <li class="divider"></li>
                        <li><a href="#">item2</a></li>
                      </ul>
        </li>
                    <li>
                        <a class="page-scroll" href="#contact">Contact</a>
                    </li>
                </ul>
            </div>
            <!-- /.navbar-collapse -->
        </div>
        <!-- /.container -->
    </nav>

                <div class="mainwrapper">
        <!--<h1 class="titre-page"> Titre document </h1>-->

        <section class="section_1"> <a href="../page_ex.html"><img src="../Pictures/GOPR2259.JPG" alt=""/></a>
        <h2>titre page</h2>
      </section>
    <div class="page_texte">

    <img src="../Pictures/GOPR1472.JPG" width="5184" height="3456" alt=""/>
  <h2>Titre</h2>
    <p>text bla bla bla</p>
    </div>

    <div class="page_texte_2">

    <img src="../Pictures/GOPR1472.JPG" width="5184" height="3456" alt=""/>
  <h2>Titre</h2>
    <p>text bla bla bla</p>
    </div>

    <div class="footer_page">
  <section class="footer_sect">
  <article class="footer">
  <h1>Pratique</h1></article>

  <ul><a href="#">Cartes et itinéraires</a></ul>
  <ul><a href="#">Les essentiels</a></ul>
  <ul><a href="#">Pour bien s'équiper</a></ul>
  </section>
  <section class="footer_sect2"><h1>En savoir +</h1>
  <ul><a href="#">A propos de nous</a></ul>
  <ul><a href="#">Mentions légales</a></ul>
  <ul><a href="#">Voyages</a></ul>
  </section>
</div>
</div>
</div>
</body>
</html>

任何人都有问题吗?感谢

0 个答案:

没有答案