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 Introduction to HTML and CSS (2016) Getting Familiar with HTML and CSS Test: Changing the Look of a Web Page

Posted by Lotte Kempe
Lotte Kempe
1,785 Points

how do i Change the color of the h1 tag to purple?

i

index.html 
<!doctype html>
<html>
  <head>
    <link href="styles.css" rel="stylesheet">
  </head>
  <body>

    <h1>Welcome to My Web Page!</h1>

  </body>
</html>
styles.css 
body {

}

1 Answer

Maxime Duhamel
Maxime Duhamel
7,169 Points
Maxime Duhamel
Maxime Duhamel
7,169 Points

Hi Lotte,

In your css you use the selector that target the body element when you actually want to target h1 element. Think about it as a label/tag that refer to where you want to apply the style.

h1{ ... }

For the color you use the color property followed by a column and then the value you want and finish with a semi-column. In this example you will end up with this.

h1 { color: purple; }

Take the time to play around with this as getting strong foundations on this will help you understand easier what's next. You can always refer to MDN or W3school website if you don't remember the name of a property or the syntax to use it.

Keep learning and don't rush.

Max

Ivan Penchev
Ivan Penchev
13,833 Points
Ivan Penchev
Ivan Penchev
13,833 Points

I think it's important to say they are different selectors to grab different elements.

for classes you select it with a . (dot), so like this:

.classname { some attributes}

for id's use #

idname { some attributes}

for element use the element name or * (for all elements).

elementname (f.x. can be h1, p or something elese) { some attributes}

for refference: https://www.w3schools.com/cssref/css_selectors.asp