Klaus Thiesler: Dynamische Site

Beitrag lesen

SELF-Forum

Dynamische Site

Klaus Thiesler
– Informationen zu den Bewertungsregeln

Hallo Manni

Ich plädiere ebenfalls für CSS mit Layertechnik <div>: was auch auf allen modernen Browsern funktioniert, sogar beim IE5.5. Damit läßt sich ein Layerfeld in Lage und Größe klar definieren, unsichtbar machen usw. Das Grafikbild kannst du slicen (in Mosaiken zerlegen) und direkt einbinden + ansprechen + sichtbar machen.
Der Ursprung stammt aus SELFHTML-Tipps+Tricks:

MoinMoin Klaus

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<style type="text/css">
<!--
body {
 padding-top:130px;
}

#box {
 color:black;
 background-color:transparent;
 position:absolute;
 top:100px;
 left:30px;
 z-index:1;
}

#box a {
 color:#f6e4c1;
 background-color:#b8ab8f;
 font-family:arial, sans-serif;
 font-size:100%;
 font-weight:bold;
 text-decoration:none;
 display:block;
 padding:5px;
 border-top:2px solid #e4d9c0;
 border-right:2px solid #837c6b;
 border-bottom:2px solid #837c6b;
 border-left:2px solid #e4d9c0;
}

#box a:visited {
 color:#f6e4c1;
 background-color:#b8ab8f;
}

#box a:hover {
 color:#f6e4c1;
 background-color:#b8ab8f;
 text-decoration:none;
 width:400px;
 border-top:2px solid #837c6b;
 border-right:2px solid #e4d9c0;
 border-bottom:2px solid #e4d9c0;
 border-left:2px solid #837c6b;
}

#box a:active {
 color:#f6e4c1;
 background-color:#b8ab8f;
}

#box a .info {
 display:none;
}

#box a:hover .info {
 color:black;
 background:#b8ab8f;
 font:14px courier,sans-serif;
 display:block;
 padding:5px;
 text-align:justify;
}
-->
</style>

</head>

<body>

<div id="box">
 <a href="#">Infobox <span class="info">Hier steht der zusätzliche Infotext.</span></a>
</div>

<p>...weiterer Text der Seite...</p>

</body>

</html>

Beitrag melden
–
Informationen zu den Bewertungsregeln