Scribd
Upload
61 views13 pages

HTML Review Overview

This document provides an overview of HTML/CSS tags and structures for web development. It includes the basic HTML page structure, common text formatting tags like headings and paragraphs, links, images, tables, lists, forms, and frames. It also discusses inline styles, external style sheets, and exercises the reader to create a home page and work on a term project home page.

Uploaded by

Babak Rezai
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
61 views13 pages

HTML Review Overview

This document provides an overview of HTML/CSS tags and structures for web development. It includes the basic HTML page structure, common text formatting tags like headings and paragraphs, links, images, tables, lists, forms, and frames. It also discusses inline styles, external style sheets, and exercises the reader to create a home page and work on a term project home page.

Uploaded by

Babak Rezai
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd

HTML/CSS Review

CA 86/CIS 86 Web development with PHP and MySQL

Tutorial

[Link]

BASIC Structure
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "[Link] <html xmlns="[Link] <head> <meta http-equiv="content-type" content="text/html; charset=iso8859-1" /> <title> Page Title</title> </head> <body> <p> Body Text </p> </body> </html>

Basic Tags


HTML Headings, <h1>..<h6>


<h1>This is a heading</h1> <h3>This is a heading</h3>

Paragraphs: <p>
<p> sample paragraph</p>

HTML Hyperlink : <a>


<a href="[Link] to google</a>

HTML Images : <img>


<img src="[Link]" alt="PHP Project Show Case" />

Links Tag


Ordinary link:
<a href="[Link] goes here</a>

Image-link:
<a href="[Link] src="URL" alt="Alternate Text" /></a>

Mailto link:
<a href="[Link] email</a>

Formatting Tags

<b> <big> <em> <i> <small> <strong> <sub> <sup>

Defines bold text Defines big text Defines emphasized text Defines italic text Defines small text Defines strong text Defines subscripted text Defines superscripted text

Inline Style


Background:


<p style="background-color:green">This is a paragraph.</p> <p style="font-family:arial;color:red;fontsize:20px;">A paragraph.</p> <h1 style="text-align:center">This is a heading</h1>

Font:


Alignment:


HTML Table Tags


<table border="1"> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </table>

HTML Lists


Unordered List:
<ul> <li>Coffee</li> <li>Milk</li> </ul>

Ordered List:
<ol> <li>Coffee</li> <li>Milk</li> </ol>

HTML Forms
<form name="input" action="html_form_action.asp" method="get"> User name: <input type="text" name="firstname" /><br /> Password: <input type="password" name="pwd" /> <input type="radio" name="sex" value="male" /> Male<br /> <input type="radio" name="sex" value="female" /> Female <input type="checkbox" name="vehicle" value="Bike" /> I have a bike<br /> <input type="checkbox" name="vehicle" value="Car" /> I have a car <input type="submit" value="Submit" /> </form>

HTML Frames
<frameset cols="25%,75%"> <frame src="frame_a.htm" /> <frame src="frame_b.htm" /> </frameset>

Style Sheets
External Style Sheets:
<head> <link rel="stylesheet" type="text/css" href="[Link]" /> </head>

Sample line in [Link]


H1 { BORDER: #101010 1px solid; FONT-WEIGHT: bolder; TEXT-ALIGN: center; }

Exercise
 

Create your home page Work on the term project home page

You might also like