XHTML and CSS - Bold text, Italic text and Horizontal Rules
Bold text, Italic text and Horizontal Rules
Let's cover our first new tag and that's a horizontal rule, in the last tutorial I talked about there being two types of tags, open and closing tags and single tags a horizontal rule is a single tag. A horizontal rule is pretty much a line that goes across you're website or a separator. You could use this when you have a new topic or you want to add a distinct new section of your website. So let's go ahead and make a horizontal rule using a part of the code from the last tutorial.
<html> <head> <title> This is the title. </title> </head> <body> <p>This is text in the body tag.</p> <p>This is another line of text in your body tag.</p> </body> </html>
Let's say between our two paragraphs and I want a line to separate them so people know that it's a new paragraph or a new part of the page, I could add in a horizontal rule between them like in the example below.
<html> <head> <title> This is the title. </title> </head> <body> <p>This is text in the body tag.</p> <hr/> <p>This is another line of text in your body tag.</p> </body> </html>
Save this and view it in your browser and you'll see a line separating the two paragraphs, so now it might be a little bit clearer to a person viewing the page that they are two separate items in the page. A good example is how eBay's search has a item with the title, image, description etc and then a horizontal line, then another item to show that they're two separate products. Next we'll be looking at italicizing text and making text bold in XHTML's em and strong tags. Usually with all your styling you'll want to use CSS, I'll show you how to do that later in this tutorial series this is how you do it in html.
<html> <head> <title> This is the title. </title> </head> <body> <p>This is <strong>text</strong> in the body tag.</p> <hr/> <p>This is <em>another line of text</em> in your body tag.</p> </body> </html>
Save that and refresh your browser and you'll see all of the text between the strong tags is now bold and the text between the em tags is italicized.

Page generated in 0.0053 seconds.