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

HTML

Posted by Leif Ottosson
Leif Ottosson
958 Points

How do I best split a heading into sections?

I want to make a heading <h1> where half of it is styled differently than the rest of it. I'm thinking about code like this:

<h1><span style="text-decoration: underline;">THIS IS A</span><span style="font-weight: 700; color: red;"> HEADING</span></h1>

Is this valid code or something that should be avoided? And if so, how do I best break up a heading in two parts with different styling?

1 Answer

Erik Nuber
Erik Nuber
20,629 Points
Erik Nuber
Erik Nuber
20,629 Points

If you are looking for multiline you can do

<h1> first part here </h1>
<h2>second part here</h2>

Using two different header tags would allow you to style them differently

or, you can call have them both as <h1> tags and give one an ID to style it differently but keep it as an <h1>

finally, as you have it there is no reason you couldn't use a span tag

<h1>first part here <span id="changeStyle">next part here</span></h1>

I don't see why you can't have an inline style as you have it but, I would think it better practice to keep styles within the CSS file. That is ultimately up to you though.