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 Basics (2014) Understanding Values and Units Font Properties

Posted by vamosrope14
vamosrope14
14,932 Points

Can I write a font-family property under any number of elements I want?

Hi just wondering,

Suppose in this example, under h1, I put ANOTHER font-family property with three different types of fonts (diff from the ones used for the <body> element). What would happen then? Would the browser get confused because there is already a font-family property in the <body> element?

Do you have to be careful about these things?

Thanks

3 Answers

Steven Parker
Steven Parker
230,274 Points
Steven Parker
Steven Parker
230,274 Points

Properties set on different elements will not interact. And because of the "cascade" nature of CSS, when properties are set on the same element in different rules, the last setting of the same precedence level overrides all others.

Update: "Last setting" refers to the order of the CSS file. When there is conflict, only the last one is used.

"Precedence level" refers to the specificity of the selector used. For example, a class selector takes precedence over a tag selector. See this MDN page on Specificity for more details.

melissamyra
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
melissamyra
Front End Web Development Techdegree Graduate 18,858 Points
melissamyra
.a{fill-rule:evenodd;}techdegree seal-36
melissamyra
Front End Web Development Techdegree Graduate 18,858 Points

In short, yes you can. Any rule you write for the child element will override any given rule to the parent element. <h1> being the child element nested inside <body> will inherit the characteristics of <body> unless otherwise defined.

The different type of fonts you include in font-family should also always relate to each other, like in the video with Helvetica Neue, Helvetica and Arial all being sans-serif fonts.

As a design tip, it is a good practice to limit the fonts you use in a website to no more than 3 for a more structured and professional look.

vamosrope14
vamosrope14
14,932 Points
vamosrope14
vamosrope14
14,932 Points

.