Does BR tag posseses height?

I know that BR is used to create line-breaks. I'm just wondering if it also creates space between lines? Please consider these example:

<p>
Hello <br/> Stackoverflow <br/><br/><br/> !
</p>

The output looks like:

Hello
Stackoverflow


!

By putting more and more BR I found distance between lines increase. Is it because of <br>? But when I try to control <br> height in CSS, it doesn't follow, it seems like it has no height at all, just a line-break. If <br> is not the cause of the space between line, then which is which and how to con开发者_如何学JAVAtrol it in CSS? Also, I usually use <br> to create large distance between lines, I do that to replace \n\r or the like when the data is from the database, is that okay?

The <br /> tag is for line breaks. You can use the CSS line-height property to control distance between lines, if you want to look at it that way.

for large distances between lines, is better to use <p> tags for every line, in which you can control the height.

http://jsfiddle.net/efortis/f6ju2/

The BR element forcibly breaks (ends) the current line of text...

More info here. and yes, adding more will increase the distance but I don't believe you can do much for styling it except applying clear.

The number of <br /> used does only create line breaks. If you are desiring to create large space between specific sections on the page I would use CSS margin attribute to distance one top section from the next. For example:

<div id="topSection" class="margin-bottom: 100px;">Hello Stackflow</div>
<div id="bottomSection">Content lower on the screen without unnecessary breaks.</div>

I found out that the space that we see when we put multiple BR is not actually caused by BR but the P element's line height.

Consider the following markup:

<p>
Hello <br/> Stackoverflow <br/><br/><br/> !
</p>

Output

1. Hello
2. Stackoverflow 
3. 
4.    
5.    !

Line 3 and 4 here are just empty lines. Despite being empty, they still posses line height.

Yes, by putting more BR tags new line breaks will be created. It is not preferred to use BR tags to create large distances between lines, rather use CSS margin and padding to introduce spaces.

As an alternative to using <br /> to get the spacing you like in between lines, you can use the CSS line-height property

I found that line-height works well in CSS. :)

p {
  font-size:20px;
  line-height:280%;
}

<p>
Hello
<br>
World!
</p>