PUBLISHED: MARCH 02, 2014 – ARTICLE: HTML BORDER CODE

We have a nice selection of HTML border codes for you below, the HTML border codes are easy to edit. Copy any of the HTML border codes or border and backgrounds code that you want to your site and edit the HTML border codes to the style you want.

How to copy the HTML border codes. Take your mouse, and place your cursor at the beginning of the HTML border codes, then click and hold the left mouse button, while pulling your mouse over the text.

This should highlight the text. Now release the left mouse button. Now, with the cursor over the highlighted text, right click the mouse for options, and select ‘copy’. Now go to where you want to paste the HTML border code, right click your mouse again, and select ‘paste’ and you will have copied and pasted the HTML border code to your site. Don’t have a website? Then click here to build your own website.

Left HTML Border Code

<p style="border-left: solid 2px #C00000; padding: 15px; margin: 0; text-align: justify; line-height: 18px; color: #000000; font-size: 15px">Put your text here</p>

Right HTML Border Code

<p style="border-right: solid 2px #C00000; padding: 15px; margin: 0; text-align: justify; line-height: 18px; color: #000000; font-size: 15px">Put your text here</p>

Top HTML Border Code

<p style="border-top: solid 2px #C00000; padding: 15px; margin: 0; text-align: justify; line-height: 18px; color: #000000; font-size: 15px">Put your text here</p>

Bottom HTML Border Code

<p style="border-bottom: solid 2px #C00000; padding: 15px; margin: 0; text-align: justify; line-height: 18px; color: #000000; font-size: 15px">Put your text here</p>

Left Dotted HTML Border Code

<p style="border-left: dotted 2px #C00000; padding: 15px; margin: 0; text-align: justify; line-height: 18px; color: #000000; font-size: 15px">Put your text here</p>

Right Dotted HTML Border Code

<p style="border-right: dotted 2px #C00000; padding: 15px; margin: 0; text-align: justify; line-height: 18px; color: #000000; font-size: 15px">Put your text here</p>

Top Dotted HTML Border Code

<p style="border-top: dotted 2px #C00000; padding: 15px; margin: 0; text-align: justify; line-height: 18px; color: #000000; font-size: 15px">Put your text here</p>

Bottom Dotted HTML Border Code

<p style="border-bottom: dotted 2px #C00000; padding: 15px; margin: 0; text-align: justify; line-height: 18px; color: #000000; font-size: 15px">Put your text here</p>

Left Dashed HTML Border Code

<p style="border-left: dashed 2px #C00000; padding: 15px; margin: 0; text-align: justify; line-height: 18px; color: #000000; font-size: 15px">Put your text here</p>

Right Dashed HTML Border Code

<p style="border-right: dashed 2px #C00000; padding: 15px; margin: 0; text-align: justify; line-height: 18px; color: #000000; font-size: 15px">Put your text here</p>

Top Dashed HTML Border Code

<p style="border-top: dashed 2px #C00000; padding: 15px; margin: 0; text-align: justify; line-height: 18px; color: #000000; font-size: 15px">Put your text here</p>

Bottom Dashed HTML Border Code

<p style="border-bottom: dashed 2px #C00000; padding: 15px; margin: 0; text-align: justify; line-height: 18px; color: #000000; font-size: 15px">Put your text here</p>

Borders And Backgrounds

<p style="background: #c00000; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #ffffff; font-size: 18px">Put your text/image here</p>

<p style="border: solid 10px #c00000; background: #F2E2BD; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #800000; font-size: 18px">Put your text here</p>

<p style="border: solid 2px #c00000; background: #F2E2BD; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #800000; font-size: 18px">Put your text here</p>

<p style="border: double 10px #c00000; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #c00000; font-size: 18px">Put your text/image here</p>

<p style="border: groove 10px #EA9400; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #000000; font-size: 18px">Put your text/image here</p>

<p style="border: dashed 5px #c00000; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #000000; font-size: 18px">Put your text/image here</p>

<p style="border: dotted 3px #c00000; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #00000; font-size: 18px">Put your text/image here</p>

If you would like to know how to make a website follow our beginner tutorials and learn step by step how to create a website in a few easy steps.