Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS CSS Foundations Web Typography Web Fonts

Posted by Alan Machall
Alan Machall
3,597 Points

where did you find the location of the font?

where do you find the location src:url('') of the font? copy from where?

4 Answers

Unsubscribed User
Unsubscribed User
2,204 Points
Unsubscribed User
Unsubscribed User
2,204 Points

Hey Alan, I myself, paused the video and copied them down the old fashion way, I guess he prepared them ( src: url(" ") ) from before hand and then pasted them.

@font-face {
    font-family: 'DroidSarifBold';
    src: url('fonts/DroidSerif-Bold-webfont.eot');
    src: url('fonts/DroidSerif-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/DroidSerif-Bold-webfont.woff') format('woff'),
         url('fonts/DroidSerif-Bold-webfont.ttf') format('truetype'),
         url('fonts/DroidSerif-Bold-webfont.svg#DroidSerifBold') format('svg');
    font-weight: bold;
    font-style: normal;
}

<p>If anyone feels lazy, feel free to use my ones.</p>

Just in case here is the icon fonts font-face. :wink:

@font-face {
    font-family: 'icomoon';
    src:url('icons/icomoon.eot');
    src:url('icons/icomoon.eot?#iefix') format('embedded-opentype'),
        url('icons/icomoon.woff') format('woff'),
        url('icons/icomoon.ttf') format('truetype'),
        url('icons/icomoon.svg') format('svg');
}
Gerard Weppler
Gerard Weppler
4,357 Points
Gerard Weppler
Gerard Weppler
4,357 Points

go to google fonts: https://www.google.com/fonts that is where I get my fonts from and is also the site that Nick Petit gave in his wed development html class

Sean T. Unwin
Sean T. Unwin
28,690 Points
Sean T. Unwin
Sean T. Unwin
28,690 Points

If I understand your question correctly, they are in the folder named, 'fonts', in the project files.

Melody Schech
Melody Schech
2,977 Points
Melody Schech
Melody Schech
2,977 Points

It does look like they were prepared and then copy/pasted. I went to this site for more information http://www.smashingmagazine.com/2011/03/02/the-font-face-rule-revisited-and-useful-tricks/