HOME

Wiki: Internet

Browser
Links
Webdesign/html/css


Um das Design einer Webseite einigermaßen sauber zu halten sollte man sich einmal für EINES entscheiden und dann dabei bleiben!
Selbstverständlich kann man im Laufe der Zeit Anpassungen vornehmen.. aber in MEINEM Fall vermische ich immer mehrere..
Darum hier für mich SELBER nochmal einige Grundlagen:

"Tabs" entsprechen zwei Leerzeichen. Da dieser Server ServerSideIncludes nutzt hier die "richtigen" Einrückungen:

<!DOCTYPE html> <!--#include virtual="./ssi/head.html" --> <title>Wiki</title> </head> <body> <!-- wenn der Elternordner poppendewildsau heisst sollte der kinderordner standardgemäss index.html heissen und nicht nochmal poppendewildsau.html !!--> <!--#include virtual="./ssi/footer.html" --> </body> </html>

Der Grund warum in Kinderordnern EIGENTLICH nur index.html enthalten sein soll statt /wiki/design/design.html ist offensichtlich:
Es ERSCHWERT meine Arbeit, dafür können Interessierte einfach durch Änderung des Links(löschen fehlerhafter/veralteter Teile) IMMER auf eine Indexseite hoffen.
Man kann sich beim SCHREIBEN arg vertun, wenn mehrere Dateien offen sind die alle nur index.html heissen -.-

CSS Definitionen:

CSS classes

<span class="cmd">Demo</span>DemoBefehlshervorhebung(Konsole?): mkdir test
<span class="con">Demo</span>DemoConsolenschriftsatz: Alle Zeichen gleich breit 111...www
<span class="inv">Demo</span>DemoHervorhebung im Text(invertiert): Demo
<kbd class="key">Demo</kbd>DemoVisualisierung von Tastendrücken: ALT+CTRL+DEL
<kbd class="button">Demo</kbd>DemoDarstellung als klickbarer Button: Weiter ABBRECHEN
<span class="mark">Demo</span>DemoHervorhebung im Text: Demo
<span class="path">Demo</span>DemoHervorhebung von Pfaden: /var/etc/fstab
<span class="green">Demo</span>DemoHinweistext: Okay
<span class="red">Demo</span>DemoWichtiger Text: Vorsicht!

Table rowspan/colspan

rowspan 2 Zeilencolspan 3 Spalten
einszweidrei
vierfünfsechssieben

<table> <tr><th rowspan="2">rowspan 2 Zeilen</th><th colspan="3">colspan 3 Spalten</th></tr> <tr><td>eins</td><td>zwei</td><td>drei</td></tr> <tr><td>vier</td><td>fünf</td><td>sechs</td><td>sieben</td></tr> </table>

CSS p classes:

<p class="hinweis">Demo</p> (auch Mehrzeilig)

Demo


<p class="warnhinweis">Demo</p> (auch Mehrzeilig)

Demo


<p class="code">          Demo Text</p> schreibt auch Leerzeichen VOR Text!

Demo Text

<p class="hexcode">          Demo Text</p> schreibt auch Leerzeichen VOR Text! Gedacht für 16 Hexbytes mit Leerzeichentrennung.

Demo Text


Einbindung von Bildern(dargestelltes Bild png; anklickbares Bild avif, Breite 910 Pixel):
<a href="./img/bild001.avif"><img src="./img/bild001.png" alt="Bild: Drei Beispielhelden" width="910" title="Drei Beispielhelden"></a><br>

html5 Icons

@www.alt-codes.net
Diese Seite wurde zuletzt am 12.03.2023 um 20:29 geändert.

(c) 2023 DHLF ☮🇺🇦