/    Sign up×
Community /Pin to ProfileBookmark

image-less/javascript-less 3-D text

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=”[I]descriptive text[/I]” to one h1 and left the other two be blank “”‘s.

[QUOTE]

<!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>

[/QUOTE]

to post a comment
CSS

1 Comments(s)

Copy linkTweet thisAlerts:
@tracknutJun 09.2007 — Interesting. Yes, it would be nice if it could be done with only one <h1>...

Dave
×

Success!

Help @WebJoel spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.5,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...