What is the correct code for turning a h1, h2 etc heading into a link and search engines
index texts of header and link both?
Is it:
<a href="#"><h1>heading</h1></a>
or
<h1><a href="#">heading</a></h1>
and could anyone explain why ?
To add an anchor to a heading in HTML, add a <section> element with an id attribute. Don't use <a name> . Use lowercase for id values, and put hyphens between words. To add an anchor to a heading in Markdown, add the following code to the end of the line that the heading is on.
To make a hyperlink in an HTML page, use the <a> and </a> tags, which are the tags used to define the links. The <a> tag indicates where the hyperlink starts and the </a> tag indicates where it ends. Whatever text gets added inside these tags, will work as a hyperlink. Add the URL for the link in the <a href=” ”>.
a > h1 { ... } As has been mentioned previously, you cannot have a block level element inside an inline one (in this case a header inside a link). However, you can have an inline level element inside a block level element (a link inside a header).
h1 and h2 are native display: block elements. Make them display: inline so they behave like normal text. You should also reset the default padding and margin that the elements have. @Pekka웃, +1 For simple solution.
Per here: http://www.w3.org/TR/html401/struct/global.html#h-7.5.4
%flow
element which display as a block (in this case <h1>
) always should surround %inline
elements (such as <a>
).
Another example <div>
should always be outside <span>
.
That is to say:
<h1><a href="#">heading</a></h1>
is correct.
An even easier way of under standing this is that the following makes sense:
<h1><a href="#1">my link</a> and <a href="#2">my other link</a></h1>
It would be highly unusual to try the inverse with multiple <h1>
s inside an <a>
.
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