Bootstrap Header不使用CSS字体系列

时间:2015-01-30 20:16:02

标签: html css twitter-bootstrap

我是网页设计,html和css的新手,但发现bootstrap可以根据我的经验使用。我的问题是,我无法弄清楚为什么我的字体系列没有被我的标题拾取。我已经加载了Google字体html代码,并将字体系列CSS添加到我能想到的任何地方,而不会被html代码拾取任何更改。我想要整个标题,但只有标题才能使用Cantarell。

这是我脑海中提供的代码

    <link href='http://fonts.googleapis.com/css?family=Cantarell|Open+Sans' rel='stylesheet' type='text/css'>


    <span itemscope itemtype="http://schema.org/LocalBusiness"> <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
          <li class="list-img"><a href="/index.html"><img src="wildfly.png" alt=" "></a></li>
    </div>
    <div id="navbar" class="navbar-collapse collapse">
      <ul class="nav navbar-nav">
        <li><a href="/aboutme.html">ABOUT ME</a></li>
    <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">DROPDOWN<span class="caret"></span></a>
    <ul class="dropdown-menu" role="menu">
        <li><a href="/pineisland.html">Pine Island</a></li>
        <li><a href="#">Another action</a></li>
        <li><a href="#">Something else here</a></li>
        <li><a href="#">Separated link</a></li>
        <li><a href="#">One more separated link</a></li>
      </ul>
</li>
        <li class="navbar-link"><a rel="author" href="#" target="_blank">CAPT&#039;S BLOG</a></li>
    <li><a href="/media.html">MEDIA</a></li>
    <li><a href="/rates.html">RATES</a></li>
      </ul>
      <ul class="nav navbar-nav navbar-right">
        <li><a href="#" target="_top"><span itemprop="email">##</a></li>
    <li class="number">| 123.123.1234</li>
      </ul>



.navbar li, p, a:link, a:visited {
display: inline;
font-size: 15px;
text-decoration:none;
color: #898989;
font-family: 'Cantarell', sans-serif;
}

.navbar li a:hover,ul#nav li.selected {
color:  #FFF ;
font-weight: bold;
 }

 .navbar-link  a:visited {
color: #898989;
}

 .navbar li.active a {
color: #FFF;
text-decoration: underline;
font-size:16px;
font-weight: bold;
border-radius: 10px;
 }

.navbar img {   
height: 65px;
 }

.navbar li.number {
color: #BFBFBF;
font-size:20px;
font-style:italic;
} 

.number {
text-decoration:none;
    padding-top:9px
}

 .navbar-collapse {
padding-top: 7px;
text-transform: uppercase;
padding-left: 5px;
padding-right: 5px;

 }

 .navbar-right {
color: #BFBFBF;
padding: 5px;
padding-top: 0px;
text-transform: none;
}

我是编码网站的新手,因为这是我的第一个,但我将不胜感激!

1 个答案:

答案 0 :(得分:0)

你需要添加font-family:&#39; Cantarell&#39 ;;到你的身体课。添加您自己的样式表,例如all.css(一定要在脑海中调用它)并添加...

body { font-family: 'Cantarell'; }