Adding Custom Fonts


Sometime you want to use a font on your website other than those which are available. So to do this you can use @font-face rule in your css stylesheet to import fonts that are not available by default. Here is an example,

main.css

@font-face {
font-family:myCustomFont;
src: url('SourceSansPro-Bold.eot'),
url('SourceSansPro-Bold.ttf');
}

h1{
font-family:myCustomFont;
font-size:32px;
}

The value of font-family is depend upon you. You can set any name or value you want . If you want to see the browser support visit this link CSS3 Font-Face Rule

 

NOTE: Fonts are intellectual property, just like software, music, and video. Be sure to have the proper license to use any font with the @font-face rule.

Some Good Website For Finding Web Fonts

Font Deck

Typekit

Edge WebFont

Google Fonts

Fonts Squirrel

Fonts.com

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s