WebJoel
06-08-2007, 07:44 PM
I was playing around trying to make some 3-D text that is not an image file and requires no javascript. I thought this was rather interesting although I wonder what a text-reader might make of it (as it is text repeated 3X..)..
I only gave a title="descriptive text" to one h1 and left the other two be blank ""'s.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<title></title>
<style type="text/css">
* {border:0; padding:0; margin:0;}/* Set everything to "zero" */
body {min-height:100%; height:101%;
font:x-small Arial, Verdana, sans-serif;
voice-family: "\"}\"";voice-family:inherit;
font-size:small;/*for IE 5.5 */
} html>body {font-size:small; height:auto;}/* Assist IE6 & <, 100% height */
font-size: small; voice-family: "\"}\"";
voice-family: inherit; font-size: medium;} /* Assist IE rendering height, keyword-font sizes, etc. */
p {font-size: 90%; line-height:1.3em; margin:12px 0 2px 0;}
h1, h2, h3, h4, h5, h6 {font-family: 'times new roman', arial, verdana, helvetica, serif; background-color:none;
font-style:normal; font-variant:normal; font-weight:normal; margin:14px 0 4px 10px;}
h1{font-size: 1.93em;}
h2{font-size: 1.72em;}
h3{font-size: 1.52em;}
h4{font-size: 1.42em;}
h5{font-size: 1.32em;}
h6{font-size: 1.21em;}
</style>
<script type="text/javascript"><!--
// -->
</script>
<link rel="shortcut icon" href="favicon.ico"><!-- path to your favicon -->
</head>
<body>
<div style="position:relative; background-color:#ececec; width:450px; height:70px; border:1px solid gray; padding:10px;">
<h1 title="" style="position:absolute; left:21px; top:22px; color:#898989; letter-spacing:0.07em; font-size:31px;">Some simple Header text</h1>
<h1 title="" style="position:absolute; left:23px; top:23px; color:#c2c2c2; letter-spacing:0.07em; font-size:31px;">Some simple Header text</h1>
<h1 title="Some simple Header text" style="position:absolute; left:24px; top:25px; color:#ff0000; letter-spacing:0.07em; font-size:31px;">Some simple Header text</h1>
</div>
</body>
</html>
I only gave a title="descriptive text" to one h1 and left the other two be blank ""'s.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<title></title>
<style type="text/css">
* {border:0; padding:0; margin:0;}/* Set everything to "zero" */
body {min-height:100%; height:101%;
font:x-small Arial, Verdana, sans-serif;
voice-family: "\"}\"";voice-family:inherit;
font-size:small;/*for IE 5.5 */
} html>body {font-size:small; height:auto;}/* Assist IE6 & <, 100% height */
font-size: small; voice-family: "\"}\"";
voice-family: inherit; font-size: medium;} /* Assist IE rendering height, keyword-font sizes, etc. */
p {font-size: 90%; line-height:1.3em; margin:12px 0 2px 0;}
h1, h2, h3, h4, h5, h6 {font-family: 'times new roman', arial, verdana, helvetica, serif; background-color:none;
font-style:normal; font-variant:normal; font-weight:normal; margin:14px 0 4px 10px;}
h1{font-size: 1.93em;}
h2{font-size: 1.72em;}
h3{font-size: 1.52em;}
h4{font-size: 1.42em;}
h5{font-size: 1.32em;}
h6{font-size: 1.21em;}
</style>
<script type="text/javascript"><!--
// -->
</script>
<link rel="shortcut icon" href="favicon.ico"><!-- path to your favicon -->
</head>
<body>
<div style="position:relative; background-color:#ececec; width:450px; height:70px; border:1px solid gray; padding:10px;">
<h1 title="" style="position:absolute; left:21px; top:22px; color:#898989; letter-spacing:0.07em; font-size:31px;">Some simple Header text</h1>
<h1 title="" style="position:absolute; left:23px; top:23px; color:#c2c2c2; letter-spacing:0.07em; font-size:31px;">Some simple Header text</h1>
<h1 title="Some simple Header text" style="position:absolute; left:24px; top:25px; color:#ff0000; letter-spacing:0.07em; font-size:31px;">Some simple Header text</h1>
</div>
</body>
</html>