Horizontal line <hr> or create lines by specifing color, length and height BBcode
Posted: Wed Jun 20, 2018 9:44 am
Default lines using <hr> in phpBB are 1 pixel high, light grey (#CCCCCC) and difficult to see, as shown below.
Alternately you can generate a darker line using the BBcode below.
BBcode usage:
HTML replacement:
Help line:
If you want to create lines with different heights and colors use the BBcode below. The number defines the line height in pixels followed by the color. To specify colors, use the CSS color names aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, orange, purple, red, silver, teal, white, and yellow or HTML colors like #6492db and grey scale colors from #000 through #fff.
BBcode usage:
HTML replacement:
Help line:
To get the heavy green line below in a post use:
The last BBcode code is similar to the code above except you can specify the line length in percent of page width. Additionally the line is centered on the page.
BBcode usage:
HTML replacement:
Help line:
To get the shorter lines below, in a post use:
NOTES:
Support for <hr> attributes were changed in html5 and are defined using CSS. However using style allows setting <hr> attributes inline.
The XHTML <hr /> closing tag is not used because it generates a second line in phpBB 3.2.
These <hr> codes were verified using the W3C.org validator.
Alternately you can generate a darker line using the BBcode below.
BBcode usage:
Code: Select all
[hr][/hr]Code: Select all
<hr style="color:#333333; border-color:#333333;">Code: Select all
[hr][/hr]BBcode usage:
Code: Select all
[Line={NUMBER}]{COLOR}[/Line]Code: Select all
<hr style="color:{COLOR}; border-color:{COLOR}; background-color:{COLOR}; height:{NUMBER}px;">Code: Select all
[Line=Height]COLOR[/Line]Code: Select all
[Line=20]GREEN[/Line]The last BBcode code is similar to the code above except you can specify the line length in percent of page width. Additionally the line is centered on the page.
BBcode usage:
Code: Select all
[LineC={NUMBER1}, {NUMBER2}]{COLOR}[/LineC]Code: Select all
<hr style="margin-left: auto; margin-right: auto; color:{COLOR}; border-color:{COLOR}; background-color:{COLOR}; height:{NUMBER1}px; width:{NUMBER2}%;">Code: Select all
[LineC=HEIGHT, LENGTH]COLOR[/LineC]Code: Select all
[LineC=1, 30]red[/LineC]
[LineC=5, 60]#555555[/LineC]NOTES:
Support for <hr> attributes were changed in html5 and are defined using CSS. However using style allows setting <hr> attributes inline.
The XHTML <hr /> closing tag is not used because it generates a second line in phpBB 3.2.
These <hr> codes were verified using the W3C.org validator.