Lesson 13 – Forms

0

HTML forms are used to gather information from the user and then pass that information to the server.  A server page or program will then gather the information passed to it and processes the information.

A form contains one or more of the following: text boxes, text areas, password fields, check boxes, list boxes, drop down lists, radio buttons, submit buttons and hidden fields.  The form can also contain fieldsets, legends and labels for each form item.

The <form> tag is used to define a form.  There is one required attribute that must be added to the form.

<form>
</form>

The action attribute is required because it tells the form what page or program will process the information it gathers.  Otherwise, the form would be pretty useless.

<form action="processingpage.php">
</form>

There are mainly two ways forms can send their data.  One of the ways is in the URL.  Another way, and a more secure way, is the form can send the form data within the page header. (more…)

Lesson 12 – Advanced Tables

0

Spanning Rows and Columns

Tables take a little while getting used to.  They become even more complicated when combining rows and columns and adding a header row to the table. (more…)

Lesson 11 – Tables

0

Tables are used to show tabular data.  There are a few tags you should be aware of before creating tables.

<table> Defines the start and end of a table
<tr> Defines rows of a table and stands for table row
<td> Defines a cell of a table and stands for table data

(more…)

Lesson 10 – Lists

0

Lists are a part of everyday life.  People use lists when grocery shopping and create to do lists when planning a series of events they want to accomplish.

There are three types of lists in HTML: unordered lists, ordered lists and definitions lists.  Unordered and ordered lists are the two simplier lists of the three.  They work the same way except for unordered lists uses bullets on the left of each item and ordered lists uses numbers. (more…)

Lesson 9 – Images

0

Images are the most simplistic form of media that we can display on a web page.  Images can range from a full background picture down to a thumbnail image.

To create an image, we use the <img> tag.  The src attribute of the <img> tag tells the browser where it can find the image.
(more…)

Lesson 8 – Links

0

The HT in HTML stands for hypertext.  Hypertext is what allows us to navigate from one page to another using our favorite web browser.

We can create the linking of page using the <a> tag or anchor tag. (more…)

Lesson 7 – Span and Div

0

During the first days of HTML, it was only meant to display text on the screen.  Since then, HTML has come a long ways.  If you look around the web, you will see a variety of well designed websites.  Most of these site use the <div> and sometimes the <span> tag to layout their content. (more…)

Lesson 6 – Formatting Text and Styles

0

Text would be very boring without a way to spice it up a little bit.  Adding color, setting it’s size and telling it what font to use make it more fun and enjoyable to read.

In older versions of  HTML, the <font> tag was used along with the face, color and size attributes was used to modify the way text looked.  Since then, they have been deprecated and are no longer supported in favor of CSS styles.

Styles was introduced in HTML 4 and is now the preferred, and easier way to define and manage, the styling of HTML elements. (more…)

Lesson 5 – Headings

0

If you add text that have headings, there is a set of HTML tags just for that purpose.  Headings (above) is contained within a heading tag.  These heading tags are <h1>, <h2>, <h3>, <h4>, <h5> and <h6> with <h1> being the largest and <h6> being the smallest.

This is an example of how they should be used.

<html>
<head>
   <title>Learning Headings</title>
</head>
<body>
<h1>Main Heading</h1>
<h2>First Topic</h2>
<p>Text of the first topic</p>
<h2>Second Topic</h2>
<p>Text of the second topic</p>
</body>
</html>

<h1> is typically used for the page title and should only be used once.  The other header tags, <h2> through <h6> can be used as much as you wish.

The general rule when using header tags is <h2> is the sub-heading of <h1>, <h3> is the sub-heading of <h2>.. and so on.

Lesson 4 – Paragraphs and Line Breaks

0

Paragraphs

To separate paragraphs of text, we use the <p> tag.

<html>
<head>
   <title>Hello World Title</title>
</head>
<body>
<p>Hello World </p>
<p>Second line of text.</p>
</body>
</html>

The <p> tag stands for paragraph.  If you load up this html code in your browser, you should see Hello World and Second line of text on double spaced lines. (more…)

Go to Top