How to Create a Border Around Text in HTML

By Brandy Alexander

As you work with HyperText Markup Language (HTML), learn how to perform certain tasks, such as creating a border around text, so that you have even more control over the display of your page. Cascading Style Sheets (CSS) works with HTML to create an outline around your content. This way, you have the option to highlight key data so that your visitors do not miss it. Using the text editor that comes with your computer, practice creating borders around your HTML content.

Step 1

Launch your computer's text editor and begin a new document.

Step 2

Type in the HTML code that creates a Web page:

Enter a name for your Web page here

Step 3

Enter the text of your Web page between the "

" tags.

Step 4

Type in "

" tags before and after your content. Additionally, enter "style=" in the opening "
" tag to prepare it for the inline CSS rule that creates the border. For example:
This is the text that has a border around it.

Step 5

Enter the "width" and "height" designators that specify the measurements of the border. Type a number value in pixels (px) after the "width" and "height" as follows:

This is the text that has a border around it.

Step 6

Type in a "border" attribute to assign the look of the border line. Enter a value in pixels to specify the width and type in the name of a color. Further, enter a characteristic, such as "solid" or "dotted," to specify how the line appears. To illustrate:

This is the text that has a border around it.

Step 7

Save your file with an "HTM" or "HTML" file ending (extension). Launch your Web browser and select the "Open" or "Open File" option under the "File" menu to open your document and view the border around your text.