Horizontal Lines!Presented by Nobel Mujuji

(BSc Hons Information Systems )(WUA)

horizontal rule

• Making a horizontal rule, or line as most of us refer to it, is easier than most people think. It's one small, short, and simple command; <hr>. Here's what is looks like in it's simplest form.

And, here's the amazing code that made it.

<hr>

Horizontal Ruler Attributes:

There are a couple of attributes or options to the <hr> command. Here's it is in summary.

<hr attribute1=".." attribute2="..">Inserts a horizontal line.Attributes:size=".." ; the thickness of the line.color=".." ; line color, Internet Explorer only.width=".." ; the length of the line.align=".." ; alignment of line: RIGHT, LEFT, or CENTER.noshade ; make a solid line.

• The SIZE is measured in pixels. Try using 3, 5, or maybe 10 to see what thickness' you like. The COLOR attribute will only work with the Internet Explorer browser so I wouldn't use it unless absolutely necessary. The COLOR should be in hexadecimal form.

• I use WIDTH attribute much more than any of the others. The WIDTH can be entered in pixels or as a percentage of the browser's window width. Here are some examples with the WIDTH attribute used

<HR WIDTH="60%" ALIGN="LEFT"><HR WIDTH="60%" ALIGN="RIGHT"><HR WIDTH="60%" ALIGN="LEFT"><HR WIDTH="60%" ALIGN="RIGHT"><HR WIDTH="60%" NOSHADE><HR COLOR="yellow" WIDTH="60%"><HR COLOR="purple" WIDTH="60%"><HR COLOR="green" WIDTH="60%">

Marquees

• Sometimes you might want your text or photos to continuously "scroll" across the screen. Or maybe you'd like it to zoom in from the side, then stay there. Or perhaps you'd like it to bounce back and forth across the screen. All these things are possible using marquees.

• There are two main methods for creating marquees (without using JavaScript). These are:

1. HTML marquees — using the HTML <marquee> tag2. CSS marquees — using CSS animations

HTML <marquee> Tag

• The <marquee> tag allows you to create marquees with a minimum of fuss. Simply add the tag, include some attributes, and there's your marquee.

• <marquee behavior="scroll" direction="left">Scrolling text...</marquee>

HTML Scrolling Text

• You can create scrolling text using the HTML <marquee> tag. Below is an example of using the HTML <marquee> tag to create scrolling text.

• <marquee behavior="scroll" direction="left">HTML scrolling text... </marquee>