I've tried checking other answers, but I'm still confused--especially after seeing W3schools HTML 5 reference.
I thought HTML 4.01 was supposed to "allow" single-tags to just be <img>
and <br>
. Then XHTML came along with <img />
and <br />
(where someone said that the space is there for older browsers).
Now I'm wondering how I'm supposed to format my code when practicing HTML 5.
<!DOCTYPE HTML>
Is it <br>
, <br/>
or <br />
?
Most of the cases in HTML, the tags are in pair. But for a line break you don't need a pair of tags. Therefore to indicate this, HTML uses
<br/>
format.<br/>
is the right one. Use that format.<br>
tag has no end tag in HTML In XHTML, the<br>
tag must be properly closed, like this:<br />
In XML every tag must be closed. XHTML is an extension of XML, hence all the rules of XML must be followed for valid XHTML. Hence even empty tags (nodes without child nodes) like
should be closed. XML has a short form called self closing tags for empty nodes. You can write
<br></br> as <br />
. Hence in XHTML<br />
is used.HTML is very lenient in this regard, and there is no such rule. So in HTML empty nodes like
<br> <hr> <meta>
etc are written without the closing forward slash.HTML
XHTML
Not all tags can be self closed. For example, a tag like
<script src="jQuery.min.js" />
is not allowed by XHTML DTD.Well all I know is that
<br />
gives a break with a white line and<br>
just gives a break in some cases. This happened to me when I was setting up an IPN-script (PHP) and sent mails and checked the inbox for it. Dont know why but I only got the message to look neat using both<br /> and <br>
Have a look at the mail here: http://snag.gy/cLxUa.jpg
The first two sections of text is seperated by
<br />
, hence the whitespace lines, the last three rows of text in the bottom and the last section is seperated by<br>
and just gives new row.<br>
works just fine. The stricter versions like XHTML require you to add the closing, and really old versions of HTML that do not include aDOCTYPE
make<br>
a non-void tag, like<br></br>
.Sum up:
<br>
is fine. Other ones are also just fine.I would recommend using <br /> for the following reasons:
1) Text and XML editors that highlight XML syntax in different colours will highlight properly with <br /> but this is not always the case if you use <br>
2) <br /> is backwards-compatible with XHTML and well-formed HTML (ie: XHTML) is often easier to validate for errors and debug
3) Some old parsers and some coding specs require the space before the closing slash (ie: <br /> instead of <br/>) such as the WordPress Plugin Coding spec: http://make.wordpress.org/core/handbook/coding-standards/html/
I my experience, I have never come across a case where using <br /> is problematic, however, there are many cases where <br/> or especially <br> might be problematic in older browsers and tools.
<br>
is sufficient but in XHTML<br />
is preferred according to the WHATWG and according to the W3C.To quote Section 8.1.2.1 of HTML 5.2 W3C Recommendation, 14 December 2017
If you use Dreamweaver CS6, then it will autocomplete as
<br />
.To validate your HTML file on W3C see : http://validator.w3.org/
XML doesn't allow leaving tags open, so it makes
<br>
a bit worse than the other two. The other two are roughly equivalent with the second preferred for compatibility with older browsers. Actually, space before/
is preferred for compatibility sake, but I think it only makes sense for tags that have attributes. So I'd say either<br/>
or<br />
, whichever pleases your aesthetics.To sum it up: all three are valid with the first one being a bit less "portable".
Edit: Now that we're all crazy about specs, I think it worth pointing out that according to dev.w3.org: