nicht angemeldet
Hi,
hier ein bisschen was zum Spielen.
Musst Dir nur ein neues Bild malen und eine externe Textdatei bauen...
<!-- --------------------------------------------------- -->
<html>
<head>
<title> CSS Möglichkeiten </title>
<script language="JavaScript" type="text/javascript">
<!--
function show()
{
if(document.getElementById)
{
document.getElementById("Seitentext").innerHTML =
parent.frames["DATEI"].document.getElementsByTagName("xmp")[0].innerHTML;
/*alert(document.getElementById("DATEI").value);*/
/*alert(parent.frames["DATEI"].document.getElementsByTagName("xmp")[0].innerHTML);*/
document.getElementById("A1").style.visibility = "visible";
}
}
function hide(element)
{
if(document.getElementById)
document.getElementById(element).style.visibility = "hidden";
}
//-->
</script>
<style type="text/css">
<!--
/*body { }*/
#Ueberschrift { position:absolute; top:20px; left:20px; z-index:3;}
#Unterschrift { position:absolute; top:170px; left:20px; z-index:6;}
#Schatten { position:absolute; top:57px; left:22px; z-index:4;}
#Grundkoerper { position:absolute; top:50px; left:15px; width:250; height:100; z-index:5;}
#A1
{
position:absolute;
top:10px;
left:10px;
/*margin-top:20px;
margin-bottom:20px;
margin-left:20px;
margin-right:20px;*/
border-width:10px;
border-style:ridge;
border-color:blue;
padding:20px;
background-color:gold;
width:600px;
visibility:
z-index:1;}
#A2
{
/*top:2px;
left:50px;*/
width:300px;
height:195px;
margin:0;
z-index:2;
float:left;
/*background-color:aqua;*/
overflow:hidden
}
#Seitentext { z-index:7;}
-->
</style>
</head>
<body bgcolor="white" text="black">
<div>
Hallo, hier steht ein Text<br>
Hallo, hier steht ein Text<br>
Hallo, hier steht ein Text<br>
Hallo, hier steht ein Text<br>
Hallo, hier steht ein Text<br>
Hallo, hier steht ein Text<br>
Hallo, hier steht ein Text<br>
Hallo, hier steht ein Text<br>
</div>
<div id="A1"> <!-- 1 -->
<div id="A2"> <!-- 2 -->
<div id="Ueberschrift" style="background:white; border:solid 2px yellow;">Überschrift</div>
<div id="Schatten" style="background-color:#c0c0c0;width:250; height:100;">Schatten</div>
<div id="Schatten" style="background-color:#a0a0a0;width:249; height:99; z-index:4;">Schatten</div>
<div id="Schatten" style="background-color:#808080;width:248; height:98; z-index:4;">Schatten</div>
<div id="Schatten" style="background-color:#606060;width:247; height:97; z-index:4;">Schatten</div>
<div id="Schatten" style="background-color:#404040;width:246; height:96; z-index:4;">Schatten</div>
<div id="Grundkoerper" style="background:white; border:solid 20px yellow;">
<img src="Test-Bild.bmp" width="210" height="60"></div>
<div id="Unterschrift" style="background:white; border:solid 0px yellow;">Unterschrift</div>
</div> <!-- 2 -->
<div id="Seitentext"
style="font-family:'Trebuchet MS',sans-serif;
font-size:10pt;
line-height:120%;
text-align:justify;" >
Seitentext <br>
Hier steht dann, was mit
dem Bild optisch
wahrgenommen wird,
in Textform.
Jede Menge Blindtext muss erzeugt werden, um den Textfluss zutesten.
Darum diese sinnlosen Zeilen !!! Hier steht dann, was mit
dem Bild optisch
wahrgenommen wird,
in Textform.
<p><a href="javascript:hide('A1')">Verstecken!</a></p>
</div>
</div> <!-- 1 -->
<div>
<p><a href="javascript:show()">Anzeigen!</a></p>
</div>
<iframe src="text.txt" width="0" height="0" NAME="DATEI">
</body>
</html>
Liebe Grüße aus http://www.braunschweig.de
Tom
Intelligenz ist die Fähigkeit, aus Fehlern Anderer zu lernen und Mut die, eigene zu machen.