Solargarten APP Solargarten Facebook Solargarten Youtube Solargarten Shop Stories



diedVIPs

html knowhow

Layer statt Tabelle












Layer (Schichten) sind ein Sprachelement von HTML, das Netscape mit der Version 4.0 seines Browsers einführte. Mit Hilfe der HTML-Elemente, die dazugehören, ist es möglich, beliebige Bereiche einer HTML-Datei als exakt positionierte Bereiche auszuzeichnen. So können Sie zum Beispiel eine Überschrift, eine Grafik und erklärenden Text dazu als Layer definieren. So können Layer-Bereiche über den Bildschirm wandern, auf-/zuklappen, anderen Inhalt annehmen usw.

Sie können beliebig viele Layer innerhalb einer HTML-Datei definieren. Layer können sich dabei auch überlappen. Wenn Sie beispielsweise zwei Überschriften mit anschließender Grafik und erklärendem Text zu je einem Layer zusammenfassen, können beide Layer die gleichen Pixelpositionen erhalten. Sie können aber auch beide Layer gleichzeitig anzeigen und bestimmen, welcher über dem anderen liegen soll.

Layer können eigene Hintergrundfarben und sogar eigene Hintergrundbilder haben. Dadurch ergeben sich viele zusätzliche Gestaltungsmöglichkeiten beim Verteilen von Farben und Formen am Bildschirm. Wenn Sie eine GIF-Grafik mit transparentem Hintergrund als eigenen Layer definieren, können Sie diese Grafik über oder unter Texte oder andere Grafiken legen und dadurch interessante Effekte erzeugen.



Layer statt Tabelle

Mit dem hier unten abgebildeten Frame binden Sie einen fremden Bewertungsframe auf Ihre Seite ein. Was Sie da sehen, ist meiner. Sie können sich eine eigene Bewertungsseite anlegen unter: webwiki.de.

Quellcode So sieht´s aus
<html>
Hier nichts

<style type="text/css">
#square2 {position:absolute;top: 0.2em;right: 0.0%;width: 5em;height: 5em;background-color: transparent;} div {padding: 0px;}
</style>

<body >
<div id="square2" class="auto-style15">
<a href="https://apps.merq.org/detail? id=appmaker.merq.xMuJxguk"> <img src="Bilder/L-APP.jpg" width="55%" style="height: auto; float:right; border: 1px solid black;" alt="Solargarten APP" /></a>
<a href="https://www.facebook.com/groups/246088556808075"><img src="Bilder/L-facebook.jpg" width="55%" style="height: auto; float:right;border: 1px solid black;" alt="Solargarten Facebook" /></a>
<a href="https://www.youtube.com/channel/ UC7ouEzdxN0bQgeSjSXVOkFg/videos"> <img src="Bilder/L-youtube.jpg" width="55%" style="height: auto; float:right;border: 1px solid black;" alt="Solargarten Youtube" /></a>
<a href="http://meinsolargarten.de/Shop/index.html"><img src="Bilder/L-shop.jpg" width="55%" style="height: auto; float:right;border: 1px solid black;" alt="Solargarten Shop" /></a>
<a href="http://meinsolargarten.de/Gebu/gaestebuch.php"> <img src="Bilder/L-Story.jpg" width="55%" style="height: auto; float:right;border: 1px solid black;" alt="Stories" /></a>
</div>

</body>
</html>



Siehe oben rechts


Layer statt Tabelle

Mit dem hier unten abgebildeten Frame binden Sie einen fremden Bewertungsframe auf Ihre Seite ein. Was Sie da sehen, ist meiner. Sie können sich eine eigene Bewertungsseite anlegen unter: webwiki.de.

Quellcode So sieht´s aus
<html>
Hier nichts

<style type="text/css">
body {
background-image: url(../bilder/marylin.jpg); /* Adresse des Hintergrundbildes */
background-repeat: no-repeat; /* Hintergrundbild ohne Wiederholung */
background-position: 30% 120em;
/* Erste Zahl Position von Links. Zweite Zahl Position von oben */
}
</style>

<body >
Hier nichts.
</body>
</html>



Das Bild erscheint dort,
wo ich es festgelegt habe:
30% vom linken Bildrand
120em vom oberen Bildrand











Kontakt    Datenschutz   Impressum