Bootstrap井和边框没有显示

时间:2018-01-01 01:10:33

标签: html css twitter-bootstrap

我有一个带有一堆css内容的head标签,我的body标签包含一个导航栏和一个简单的标题。然而,在标题的行周围,我有一个井,但井和它的边界显示。我需要帮助修好井以展示“耶稣是主”,所以它看起来很干净。我也希望井在0.8不透明度。这是页面(在theredstonetaco.com上直播):

<html>
  <head>
<!-- https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta -->
<meta charset="utf-8"/>
<meta content="initial-scale=1, width=device-width" name="viewport"/>

<!-- bootstrap css, jQuery, popper, bootstrap js-->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>

<style>
  well {
    border: solid 5px green;
  }
</style>

<!-- title -->
<title>Homepage</title>

<!--

background
and
navbar

-->

<!-- full-page cross image -->
  <div style="position:absolute;z-index:-1;left:0;top:0;width:100%;height:100%;">
    <img style="width:100%;height:100%;" src="https://upload.wikimedia.org/wikipedia/commons/8/87/Christian_cross.svg" alt="full-page cross" />
  </div>
  <!-- outer navbar, dark, dark, fixed position -->
  <nav class="navbar navbar-light bg-light navbar-fixed-top">

    <!-- fluid container -->
    <div class="container-fluid">

      <!-- row for dropdowns -->
      <div style="flex-grow:1;" class="row">

        <!-- left dropdown (taccount) -->
        <div style="flex-grow:1;"class="col col-xs-4">
          <ul class="navbar navbar-nav">
            <li class="nav-item dropdown">
              <a class="navlink dropdown-toggle" href="#" id="navbarDropdownMenuLinkLeft" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
              taccount
              </a>
              <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLinkLeft">
                <a class="dropdown-item" href="login.php">login</a>
                <a class="dropdown-item" href="register.php">register</a>
                <a class="dropdown-item" href="#">profile</a>
                <a class="dropdown-item" href="#">settings</a>
              </div>
            </li>
          </ul>
        </div>

        <!-- middle homepage button (tacopage) -->
        <div style="flex-grow:1;" class="col col-xs-4">
          <ul class="navbar navbar-nav">
            <li>
            <a href="homepage.php">tacopage</a>
            </li>
          </ul>
        </div>

        <!-- right dropdown (tactions) -->
        <div style="flex-grow:1;" class="col col-xs-4">
          <ul class="navbar navbar-nav navbar-right">
            <li class="nav-item dropdown">
              <a class="navlink dropdown-toggle" href="#" id="navbarDropdownMenuLinkRight" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
              tactions
              </a>
              <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLinkRight">
                <a class="dropdown-item" href="Christmas.php">Christmas</a>
                <a class="dropdown-item" href="dad.php">dad</a>
                <a class="dropdown-item" href="https://youtube.com/theredstonetaco">youtube</a>
                <a class="dropdown-item" href="dating.php">dating</a>
                <a class="dropdown-item" href="#">about</a>
              </div>
            </li>
          </ul>
        </div>

      </div>

    </div>

  </nav>

<!-- embed addons to layout -->
<div class="well">
  <div class="row">
    <div class="col"></div>

    <div class="col text-center" style="opacity: 0.8; color: #000A8C;">
      <h1>Jesus is Lord</h1>
    </div>

    <div class="col"></div>
  </div>
</div>

1 个答案:

答案 0 :(得分:2)

类选择器需要一个。在它面前。 所以正确的风格是;
(pi * degree / 180 )

为了完整; here您可以找到所有css选择器以及如何使用它们。