Difference between revisions of "Using Google fonts in styling"

From TempusServa wiki
Jump to navigation Jump to search
old>Admin
m (13 revisions imported)
 
(6 intermediate revisions by one other user not shown)
Line 2: Line 2:


http://www.google.com/webfonts
http://www.google.com/webfonts
Klik "Quick use" on the font you want to use and follow the directions.


Change your stylesheet like this example
Change your stylesheet like this example
<blockquote>
<blockquote>
...<br>
@import url(http://fonts.googleapis.com/css?family=Molle:400italic);<br>
@import url(http://fonts.googleapis.com/css?family=Molle:400italic);<br>
...<br>
...<br>
.TempusServaPage h3 { font-family: 'Molle'}<br>
.TempusServaPage h3 { font-family: 'Molle'; }<br>
...<br>
</blockquote>
</blockquote>


The import method is needed, but embedding by a link inside a wrapper is also possible.


<link href='http://fonts.googleapis.com/css?family=Molle:400italic' rel='stylesheet' type='text/css'>
<!--
<style type="text/css">
@import url(http://fonts.googleapis.com/css?family=Molle:400italic);
.TempusServaPage h3 { font-family: 'Molle'; }
</style>
<h3 style="font-family: 'Molle';">Enjoy youre new font</h3>
<h3 style="font-family: 'Molle';">Enjoy youre new font</h3>
-->

Latest revision as of 11:56, 10 December 2021

Find a font you alike

http://www.google.com/webfonts

Klik "Quick use" on the font you want to use and follow the directions.

Change your stylesheet like this example

...
@import url(http://fonts.googleapis.com/css?family=Molle:400italic);
...
.TempusServaPage h3 { font-family: 'Molle'; }
...

The import method is needed, but embedding by a link inside a wrapper is also possible.