Questions tagged [html-heading]

In HTML, the

,

,...

tags define headings of different levels,

being the highest. Browsers typically apply preset top and bottom margins as well as different font sizes and weights to headings.

The headings elements from <h1> to <h6> represent six levels of element headings, where <h1> is the highest s level and <h6> is the lowest level.

Usage notes

  • Heading information can be used by user agents to construct a table of contents for a document automatically.
  • Avoid using heading elements to resize text. Instead, use the CSS font-size property.
  • Avoid skipping heading levels: always start from <h1>, followed by <h2> and so on.
  • Use only one <h1> per page or view. It should concisely describe the overall purpose of the content.
  • Using more than one <h1> will not result in an error, but is not considered a best practice. It is beneficial for screen reader users, and SEO.
  • While HTML5 allows a <h1> per sectioning element, it is not considered best practice, and may subvert the expectations of how screen reader users navigate.
250 questions
121
votes
6 answers

Bootstrap center heading

It is my first Twitter Bootstrap experience. I have added some headings (h1, h2, etc.) and they are aligned by left side. What is the right way to center headings?
SiberianGuy
  • 24,674
  • 56
  • 152
  • 266
43
votes
6 answers

How do I center an h1 in the body

I tried centering my h1 in the body tag like this: h1 {margin:0 auto} http://jsfiddle.net/qPDwY/ But it doesn't center. How do I fix it?
user3182981
  • 443
  • 1
  • 4
  • 4
34
votes
15 answers

Is there a JavaScript solution to generating a "table of contents" for a page?

I have headers in

through

tags. Is there a way that I can use JavaScript to generate a table of contents for the contents that serves as anchor tags as well? I would like the output to be something like:
  1. Header 1
Thomas Owens
  • 114,398
  • 98
  • 311
  • 431
33
votes
6 answers

In CSS how do you change font size of h1 and h2

In a WordPress twenty eleven theme. I want to change the size of headings When I wrap my headings around h1 and h2 tags as follows

My h1 heading

My h2 heading

The font size of heading in the theme I am using is almost same as…
Ahmed
  • 14,503
  • 22
  • 92
  • 150
30
votes
7 answers

how to have two headings on the same line in html

I want to have two headings h2 and h3 on the same horizontal rule one on the left and the other on the right. They have a HR underneath them and I want them to be at the same distance from this HR. I tried making them both inline and have one float…
Aditya Sastry
  • 391
  • 2
  • 4
  • 8
25
votes
3 answers

Is it possible to create HTML tags h7, h8, h9 and so on?

Is it possible to create more heading styles, like h7, h8, and so on? Is it possible to have more than six different types of headings on a website?
user3380148
  • 379
  • 2
  • 5
  • 10
24
votes
4 answers

H1, H2, H3, H4, H5, H6 inside table TH tags? - HTML

Can i use H1, H2, H3, H4, H5, H6 inside the table TH tags? - HTML I tryed to validate with the w3 validator, but it doesn't validate. I get this: The element h4 must not appear as a descendant of the th element.

Orange

I use…
Jo Smo
  • 6,923
  • 9
  • 47
  • 67
22
votes
5 answers

Forcing headings to wrap in html

I have a web page that displays a pdf document. In the header there is an image and an h1 tag that contains a name. When the name is too long, it gets cut off. How can I force it to wrap to the next line instead so that the entire name is displayed?…
froadie
  • 221
  • 1
  • 2
  • 3
15
votes
5 answers

Same font size for h1 and h2 in article

Problem: Why do

and

tags have the same font-size when being put inside an
? Output: Then I thought maybe it's simply my eyes who fool me so I measured it up. I turned out to be the same size. I looked at the following link…

kexxcream
  • 5,873
  • 8
  • 43
  • 62
15
votes
3 answers

H heading + some other text on the same line

I am trying to have a heading and then some less important text on the same line: Skill Ratings (scale of 5) but I really want (scale of 5) to be in the same line as well as that Skill Ratings be wrapped in the tags for document structure…
amphibient
  • 29,770
  • 54
  • 146
  • 240
12
votes
3 answers

How to add heading (h1, h2...) buttons to tinyMCE with advanced theme, simple layout?

I have a tinyMCE editor which uses the advanced theme. I am using the simple layout on that advanced theme so I can define my own toolbars on init() without having to get too deep into what tinyMCE is doing. The problem I have is that my editor…
Joe Green
  • 1,745
  • 1
  • 12
  • 17
11
votes
4 answers

Removing space between h1 and h2

I have stumbled across a problem that I can not seem to solve in any way, maybe I am using divs in a wrong way? .greeting h1 { font-family: 'Raleway', sans-serif; font-weight: lighter; font-size: 100px; text-align:…
user3552616
11
votes
2 answers

Why is size of H1 different inside a section element?

I'm the very new beginner at HTML5 even in HTML. My confuse is about the heading which is used by HTML code, this is my code snippet:

Text A

Text B

Yagami
  • 199
  • 1
  • 11
11
votes
3 answers

How can I place two headings next to each other using CSS?

Category
auto
places Category and auto on separate lines, like this: Category auto How can I place them both on the same line, like this? Category auto
w35t
  • 293
  • 3
  • 4
  • 11
10
votes
3 answers

What is a good HTML5 Outliner?

I've been reading Dive Into HTML5, and Mark mentions that: "You can test your own pages in the HTML5 Outliner to ensure that you’re using the heading elements properly." I've tried this HTML5 Outliner and I know that it is functional from…
leeand00
  • 25,510
  • 39
  • 140
  • 297
1
2 3
16 17