Transition From HTML 4.01 To XHTML 1.0 and Style Sheets

Transtion from HTML 4.01 to XHTML 1.0 Tag Changes.

By the way we do not use Capitol letters in our html in CSS.

The idea is to switch and start to use Tags that will Validate as html 4.01. Then we can swith over to xhtml 1.0 CSS Pages with a few minor changes to a couple of tags.

Document HTML 4.01

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Page Name</title>
</head>
<body bgcolor="#000000" text="#ffffff">

<p>Page text.........</p>

</body>
</html>

Document XHTML 1.0 CSS

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>CSS Style Pages</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--

body {background: #000000; color: #ffffff}

-->

</style>
</head>
<body>

<p>Page Text........</p>

</body>
</html>

Script used for html 4.01

<body bgcolor="#000000" text="#ffffff">

<p>First paragraph.</p>

<p>Second paragraph.<br><br>

Item one<br>
Item two.</p>

Script used for xhtml 1.0 or CSS

<style type="text/css">
<!--

body {background: #000000; color: #ffffff}

p {background: #000000; color: #330066; font-style: oblique; color: #330066; font-size: 18pt; margin-left: 15px}

-->

</style>
</head>
<body>
<p>First paragraph.</p>

<p>Second paragraph.<br />
Item one<br />
Item two.</p>

<hr />

Method to center HTML 4.01 Images.

To Validate:
<div style="text-align: center">

Text or Image.

</div>

Method to center xhtml CSS Images.

To Validate:

<div style="text-align: center;">

Image

</div>

Image Tag HTML 4.01

<img src="http://domania.us/sonny175/gif/tex-flag.gif" width="68" height="50" border="0" alt="Flag">

This Image tag validates by adding:
The: ( alt ) alt="flag"> to the Tag.

All Image Tags should use a border="0" (Zero) or the Computer gives it a Default of 2 as a border.

Image Tag html 1.0 or CSS.

<img style="border:0;width:68px;height:50px" src="http://domania.us/sonny175/gif/tex-flag.gif" alt="Flag" />

This Image Tag Validated for the 1.0 CSS, but I had to end:
The /tex-flag.gif" alt="Flag" /> to comply with xhtml 1.0 CSS rules.

Practice html 4.01 on Validator.

Copy Image Tags using c/c/p and check the Validation by Pasting in the body of the Template.

Validate 4.01

Sonny @ The Cove