在freecodecamp.com上導入google字體

我在freecodecamp.com上做了第15課，但我似乎無法完成它。目標是讓我的h2元素使用字體'龍蝦'，同時保持等寬。我應該複製「http://fonts.googleapis.com/css?family=Lobster'rel ='stylesheet'type ='text/css'>」。這是我寫的代碼：在freecodecamp.com上導入google字體

<style> 
    .red-text { 
    color: red; 
    } 

    p { 
    font-size: 16px; 
    font-family: Monospace; 
    } 
</style> 

<style> 
<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'> 
</style> 

<h2 class='red-text'>CatPhotoApp</h2> 

<p class='red-text'>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p> 
<p class='red-text'>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

來源

2015-06-28 Lescott Makiwa

所以，你需要使用龍蝦作爲FONT-FAMILY：

h2 { 
    font-family: Lobster; 
}

來源

2015-06-28 19:03:48

這是如何使'H2'元素使用'龍蝦'？ – Bond

ooooops！更新... –

有一對夫婦與片斷的問題，你把，以及：

<link>在<head>中標記席位，而不是在<style>標記中。
它最好把<style>標籤本身在<head>標籤

這裏是一個示例：

<!DOCTYPE html> 
<html> 
    <head lang="en"> 
     <meta charset="UTF-8"> 
     <title></title> 
     <link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'> 

     <style> 
      .red-text { 
       color: red; 
      } 

      p { 
       font-size: 16px; 
       font-family: Monospace; 
      } 

      h2 { 
       font-size: 16px; 
       font-family: Lobster; 
      } 
     </style> 
    </head> 
    <body> 

     <h2 class='red-text'>CatPhotoApp</h2> 

     <p class='red-text'>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the 
      red dot, hairball run catnip eat the grass sniff.</p> 

     <p class='red-text'>Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the 
      sink fluffy fur catnip scratched.</p> 

    </body> 
</html>

來源

2015-06-28 19:04:17 Ali

這是如何使'H2'元素使用'龍蝦'？ – Bond

你是對的@Bond，我錯過了h2位;）將它包含在示例中。謝謝。 – Ali

style> 
    .red-text { 
    color: red; 

    } 

    h2 { font-family : Lobster} 

    p { 
    font-size: 16px; 
    font-family: Monospace; 
    } 
</style>

這是正確的答案

來源

2015-07-10 10:57:46

<head> 
     <link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css"> 
    <style> 
     .red-text { 
     color: red; 
     } 

    p { 
     font-size: 16px; 
     font-family: Monospace; 
     } 

    h2 { 
     font-size: 16px; 
     font-family: Lobster; 
     } 
    </style> 
</head> 

    <h2 class="red-text";>CatPhotoApp</h2> 

    <p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p> 

    <p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

上面的代碼幫助我進入下一步。我最初在CSS樣式中打電話給龍蝦字體，哎呀！最後，我發現這個網站和下面的鏈接（https://developers.google.com/fonts/docs/getting_started）幫助我認識到，我需要在風格前創建一個頭像，並將電話放在那裏（頭像），從當然的說明中複製並粘貼。

來源

2015-08-21 16:34:57

在freecodecamp.com上導入google字體

回答

相關問題