HTML: HR Tag and make Comments

Author: Ronald S. Holland
at
Total Application Works






HOME] Consulting Design Maintenance Project Testing Training Turnkey Java C++ SQL HTML JavaScript ]
//sumtotalz.com/TotalAppsWorks/Javascript/MY_JS_TOC.html">JavaScript ]



To contact us

© 2002 - 2013 All Rights Reserved Total Application Works


  • Tell a friend about this site (copy and paste the following HTML page into a file (e.g., using Notepad).)
    <html>
    <head>
    <title>Example of a link </title>
    </head>
    <body>
    <a href="http://sumtotalz.com/TotalAppsWorks/HTML/Comment_and_HR.html">
    Comment and HR Tags </a>
    </table>
    </body>
    </html>






<

How to write a HTML Page with HR Tag and make Comments

The purpose of this tutorial is to show you how to write a HTML page using the HR (Horizontal Rule) tag and comments. What is HTML (HyperText Markup Language)? HTML is a layout/tag language that is used to organize text and/or images on a web page. In the following example, we will show you the code for our page that uses the HR tag and use comments. Consider the following example

<html>
<body>
 
                                 William Jones  
                                 123 Main St. 
                                 Spokane, WA   99201
 
                                 April 3, 2008


To: James Worthington Subject: Roofing Repairs on My House
</body>
<!-- This HTML page will display the HR tag and a comment -->
</html>
Figure 1: HTML Example of a page with HR tag and a comment


In Figure 1, we show an example of a comment and the use of the HR tag. We use the HR tag to visually separate sections of a page.

The HR tag is often used to show a change in topic. This has the effect of visually separating sections of the document.

<!-- Here is an example of the horizontal rule tag: -->
<hr>

Figure 2: HTML Example of a page with commented horizontal rule tag


Horizontal Ruled (HR) Lines are used to separate different areas of a web page. In HTML the <hr> tag has no end tag.
Attribute Value Description
align center
left
right
Specifies the alignment of the horizontal rule. Deprecated. Use cascading style sheets instead
noshade noshade When set to true the rule should render in a solid color, when set to false the rule should render in a two-color "groove". Deprecated. Use cascading style sheets instead
size pixels
%
Specifies the thickness (height) of the horizontal rule. Deprecated. Use cascading style sheets instead
width pixels
%
Specifies the width of the horizontal rule Deprecated. Use cascading style sheets instead


<html>
<body>
<p>This is the start of a paragraph.
<!-- Comment: The use of the HR tag is with deprecated attributes -->
<HR width="50%" align="center">
<HR size="5" width="50%" align="center">
<HR noshade size="5" width="50%" align="center">
</body>
</html>
Figure 3: HTML Example of a page with the HR tag and deprecated attributes


  1. <html> - indicates the beginning of the HTML page
  2. <body> - indicates the beginning of what will be displayed on the user's screen
  3. <p> - indicates the beginning of a paragraph
  4. <pre> - indicates the beginning of the preformatted text
  5. <!--> - indicates the beginning of commented text
  6. <HR> - indicates that a horizontal rule will be displayed
  7. <--> - indicates the end of the preformatted text
  8. </p> - indicates the end of the comment
  9. </body> - indicates the end of what will be displayed on the user's screen
  10. </html> - indicates the end of the HTML page
The HTML in Figure 3 when displayed by your browser will look like:

This is the start of a paragraph.




Figure 4: HTML Example HR tag


Feel free to copy and paste the code the above figures into a source file.












HOME] Consulting Design Maintenance Project Testing Training Turnkey Java C++ SQL HTML JavaScript ]



To contact us

© 2002 - 2013 All Rights Reserved Total Application Works