I am trying to style all the headings in my header with a different font-family than the headings on the rest of the page but I am having trouble getting the style to only apply to the specific header ID.
Here is what I tried:
#header h1,h2,h3,h4 {
font-family:'Helvetica';
}
But this causes all h1/2/3/4 tags to use the Helvetica font regardless of if they are in the header div or not. I'm sure I am missing something simple, can anyone help? Thanks!
The id attribute assigns an identifier to the <header> element. The id allows JavaScript to easily access the <header> element. It is also used to point to a specific id selector in a style sheet. Tip: id is a global attribute that can be applied to any HTML element.
The CSS id Selector The id selector uses the id attribute of an HTML element to select a specific element. The id of an element is unique within a page, so the id selector is used to select one unique element! To select an element with a specific id, write a hash (#) character, followed by the id of the element.
The <div> tag is easily styled by using the class or id attribute. Any sort of content can be put inside the <div> tag!
I think you must do so:
#header h1,#header h2, #header h3, #header h4 {
font-family:'Helvetica';
}
You need to target all hN
with the ID.
#header h1,
#header h2,
#header h3,
#header h4 {
font-family:'Helvetica';
}
See Fiddle
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With