Google Fonts API


Bir süre önce , "Google Font API" 'yi duyurdu.. Google Font API sayesinde browserlardan bağımsız olarak istediğimiz bir font'u kullanabiliriz.
The Google Font API hides a lot of complexity behind the scenes.
API sayesinde IE6 dahil olmak üzere bütün güncel browserlarda aynı sonucu alabiliyoruz..
 Google’s serving infrastructure takes care of converting the font into a format compatible with any modern browser (including Internet Explorer 6 and up)
 Google'ın bu konuda yazdıklarını okumak isterseniz buradan bulabilirsiniz.

 Veya bu yazıya devam edip nasıl kullanabileceğinizi hemen öğrenebilirsiniz !

Nasıl Kullanılır 


Basit bir html sayfası oluşturalım :



<!DOCTYPE html>

<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;  charset=utf-8">
</head>
<body>

<h1> Make the Web Beautiful <h1>

</body>
</html>



Şimdi bu sayfamızdaki "Make the Web Beautiful"  header'ımızın font'unu değiştirelim. Tabi ki bunun için Google Font API'yi kullanacağiz.




Google Font Directory 'den istediğimiz bir font'u seçelim. Bu örnekte kullanmak için "Tangerine" font'unu seçtim.


 Açılan sayfadan "Get The Code" sekmesi ile kodumuzda kullanacağımız kodlara ulaşabiliriz..


 Yapmamız gereken tek şey burada bulunan "link" kodunu sayfamıza eklemek ve seçtiğimiz fontu istediğimiz element'e atamak!


Şöyle ki :




<!DOCTYPE html>

<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;  charset=utf-8">
<title>untitled</title>

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


<style>
h1 { font-family: 'Tangerine', arial, serif; font-size:50px }

</style>

</head>
<body>

<h1> Make the Web Beautiful <h1>

</body>
</html>


Ve işte sonuç : 

Make the Web Beautiful

Comments