Bootstrap Text header 3变为白色？

时间：2015-09-22 11:36:41

标签： html css twitter-bootstrap 

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<head>
  <title>Bibliotek</title>
  <meta charset="utf-8">
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="removed because too immature" rel="stylesheet">
</head>
<body>
  <ul class="list-group">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<center>
<span class="badge">Biblioteket</a>

  <a href="#" class="list-group-item" data-toggle="modal" data-target="#blah"><span class="badge">1</span>Pipi and the HTML world!</li></a>
  <div id="blah" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm">
      <div class="modal-content">
        <h3>Pipi and the HTML world!</h3>
          <a href="#"><button type="button" class="btn btn-primary">Kolla på</button>
          <a href="bib.html"><button type="button" class="btn btn-primary">Tillbaka</button>
      </div>
    </div>
  </div>

  <a href="#" class="list-group-item" data-toggle="modal" data-target="#My_Little_Pontus"><span class="badge">2</span>My Little Pontus</li></a>
  <div id="My_Little_Pontus" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm">
      <div class="modal-content">
        <h3>My Little Pontus</h3>
          <a href="story/story1.html"><button type="button" class="btn btn-primary">Kolla på</button>
          <a href="bib.html"><button type="button" class="btn btn-primary">Tillbaka</button>
      </div>
    </div>
  </div>

  <a href="#" class="list-group-item" data-toggle="modal" data-target="#Mom_and_Dad"><span class="badge">3</span>Mom and Dad In the park</li></a>
  <div id="Mom_and_Dad" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm">
      <div class="modal-content">
        <h3>Mom and Dad In the park</h3>
          <a href="#"><button type="button" class="btn btn-primary">Kolla på</button>
          <a href="bib.html"><button type="button" class="btn btn-primary">Tillbaka</button>
      </div>
    </div>
  </div>

  <a href="#" class="list-group-item" data-toggle="modal" data-target="#kids"><span class="badge">4</span>Kids Show the book</li></a>
  <div id="kids" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm">
      <div class="modal-content">
        <h3>Kids Show the book</h3>
          <a href="#"><button type="button" class="btn btn-primary">Kolla på</button>
          <a href="bib.html"><button type="button" class="btn btn-primary">Tillbaka</button>
      </div>
    </div>
  </div>

  <a href="#" class="list-group-item" data-toggle="modal" data-target="#Hello_Mom"><span class="badge">5</span>Hello Mom</li></a>
  <div id="Hello_Mom" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm">
      <div class="modal-content">
        <h3>Hello Mom</h3>
          <a href="#"><button type="button" class="btn btn-primary">Kolla på</button>
          <a href="bib.html"><button type="button" class="btn btn-primary">Tillbaka</button>
      </div>
    </div>
  </div>

<br>
<center><a href="index.html"><button type="button" class="btn btn-primary btn-lg">Framsidan</button></center></a>
</ul>
</body>
</html>

你好我有一个Bootstrap标题3的问题它似乎在我的一个页面上工作它的原始颜色是灰色但在另一个页面上它的白色或透明。

这是一个例子： Error with font.

正如你所看到的，我必须强调它，因为它是隐形的任何想法？ 我尝试手工制作头部样式，但这里没有用的是代码示例：

1 个答案:

答案 0 :(得分：1)

您只需要为h3标签添加样式。例如，对于模态/弹出窗口中的黑色文本：

<style>
.modal-content h3 {
    color: black;
}
</style>


<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<head>
  <title>Bibliotek</title>
  <meta charset="utf-8">
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="penis.css" rel="stylesheet">
</head>
<body>
  <ul class="list-group">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<center>
<span class="badge">Biblioteket</a>

  <a href="#" class="list-group-item" data-toggle="modal" data-target="#blah"><span class="badge">1</span>Pipi and the HTML world!</li></a>
  <div id="blah" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm">
      <div class="modal-content">
        <h3>Pipi and the HTML world!</h3>
          <a href="#"><button type="button" class="btn btn-primary">Kolla på</button>
          <a href="bib.html"><button type="button" class="btn btn-primary">Tillbaka</button>
      </div>
    </div>
  </div>

  <a href="#" class="list-group-item" data-toggle="modal" data-target="#My_Little_Pontus"><span class="badge">2</span>My Little Pontus</li></a>
  <div id="My_Little_Pontus" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm">
      <div class="modal-content">
        <h3>My Little Pontus</h3>
          <a href="story/story1.html"><button type="button" class="btn btn-primary">Kolla på</button>
          <a href="bib.html"><button type="button" class="btn btn-primary">Tillbaka</button>
      </div>
    </div>
  </div>

  <a href="#" class="list-group-item" data-toggle="modal" data-target="#Mom_and_Dad"><span class="badge">3</span>Mom and Dad In the park</li></a>
  <div id="Mom_and_Dad" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm">
      <div class="modal-content">
        <h3>Mom and Dad In the park</h3>
          <a href="#"><button type="button" class="btn btn-primary">Kolla på</button>
          <a href="bib.html"><button type="button" class="btn btn-primary">Tillbaka</button>
      </div>
    </div>
  </div>

  <a href="#" class="list-group-item" data-toggle="modal" data-target="#kids"><span class="badge">4</span>Kids Show the book</li></a>
  <div id="kids" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm">
      <div class="modal-content">
        <h3>Kids Show the book</h3>
          <a href="#"><button type="button" class="btn btn-primary">Kolla på</button>
          <a href="bib.html"><button type="button" class="btn btn-primary">Tillbaka</button>
      </div>
    </div>
  </div>

  <a href="#" class="list-group-item" data-toggle="modal" data-target="#Hello_Mom"><span class="badge">5</span>Hello Mom</li></a>
  <div id="Hello_Mom" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
    <div class="modal-dialog modal-sm">
      <div class="modal-content">
        <h3>Hello Mom</h3>
          <a href="#"><button type="button" class="btn btn-primary">Kolla på</button>
          <a href="bib.html"><button type="button" class="btn btn-primary">Tillbaka</button>
      </div>
    </div>
  </div>

<br>
<center><a href="index.html"><button type="button" class="btn btn-primary btn-lg">Framsidan</button></center></a>
</ul>
</body>
</html>

相关问题
最新问题