Seong Lee
Seong Lee

Reputation: 10580

CSS font-family inherit for headings

If I want to use font family used in the body for headings, I can simply use inherit property but what if I want to use different font family other than that used in the body for headings?

For example, I can make it like:

h1 { font-family:'Noto Sans', sans-serif; }
h2 { font-family:'Noto Sans', sans-serif; }
h3 { font-family:'Noto Sans', sans-serif; }
h4 { font-family:'Noto Sans', sans-serif; }
h5 { font-family:'Noto Sans', sans-serif; }
h6 { font-family:'Noto Sans', sans-serif; }

but I want to know parent-child hierarchy of heading tags (if there is one) to see if I can do this and avoid duplicates.

h1 { font-family:'Noto Sans', sans-serif; }
h2 { font-family:inherit; }
h3 { font-family:inherit; }
h4 { font-family:inherit; }
h5 { font-family:inherit; }
h6 { font-family:inherit; }

Upvotes: 0

Views: 4259

Answers (1)

jeremy
jeremy

Reputation: 10057

Unfortunately, all the heading tags are separate elements and don't follow any type of inheritance rules like you've listed.

What you can do is try and setting all of the font-family settings all at once like using a comma-separated list.

h1, h2, h3, h4, h5, h6 {
    font-family: 'Noto Sans', sans-serif;
}

Upvotes: 3

Related Questions