Font Sample

by DaveAlger

HTML

<!--[if IE]>
<style type="text/css" media="screen">
@font-face {
    font-family: K;
src: url(http://tasteslikeadonut.com/fonts/Ka.eot);
    }
</style>
<![endif]-->


<p class="Kfont font-normal">This is a sample of using embeded web fonts</p>

<p class="Kfont font-large font-red">This should work in all major browsers including internet exploder</p>

<p class="Kfont font-small font-green">ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz</p>

CSS

.Kfont {
    font-family: K, Verdana, Arial, Helvetica, sans-serif;
    font-size:40px;
    font-weight:200;
    /*
    text-shadow: #FFF 3px 3px 0px; 
    -webkit-transition-property: opacity, text-shadow, color;
    -webkit-transition-duration: 2s, 2s, 2s;
    */
    color:#999;
    color:#00B7EB;
    margin:0;
    padding:10px;
}

.font-normal {
    font-size:24px;
    font-weight:200;
}

.font-large {
    font-size:40px;
    font-weight:200;  
}

.font-small {
    font-size:18px;
    font-weight:200;  
}

.font-red {
    background: crimson;
    color: white;
}

.font-green {
    background: #88cc99;
    color: #006600;
}

.font-blue {
    background: navy;
    color: white;
}

@font-face {
    font-family: K;
    src: url('http://:/')format('No-IE-404'), url(http://tasteslikeadonut.com/fonts/Ka.otf) format("opentype");
    }