Hilfe:Rahmen und Farben: Unterschied zwischen den Versionen

Aus Weimarnetz Wiki
Zur Navigation springen Zur Suche springen
 
 
(3 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
 
===Rahmen===
 
===Rahmen===
Wie mache ich einen Rahmen?
+
====Wie mache ich einen Rahmen?====
 
z.B. sieht so der Quelltext aus:
 
z.B. sieht so der Quelltext aus:
 
<pre>
 
<pre>
<div style="border: 1px dotted grey; padding: 5px; margin: 0px 0px 20px 0px;background-color:#f8f8ff;">
+
<div style="border: 5px dotted green; padding: 5px; margin: 0px 300px 0px 100px;background-color:#f8f8ff;">
 +
:Na ihr Plinsen. Heute noch gar nicht´s verändert?
 +
</div>
 
</pre>
 
</pre>
 +
 +
:Das sieht dann z.B. so aus:
 +
 +
<div style="border: 5px dotted green; padding: 5px; margin: 0px 300px 0px 100px; background-color:#f8f8ff;">
 +
:Na ihr Plinsen. Heute noch gar nicht´s verändert?
 +
</div>
 +
 +
:Erklärung:
 
* style: border - Fenster oder Umrandungslinie
 
* style: border - Fenster oder Umrandungslinie
** 1px dotted grey - 1Pixel gepunktet grau
+
** 1px dotted green - 1Pixel stark gepunktete grüne Umrandung
* padding:  
+
*** oder: 1px solid green - 1Pixel stark durchgezogene Linie grüne Umrandung
** 5px -  
+
* padding: - Abstand
* margin: - Begrenzung
+
** 5px - Abstand zwischen Rand und Text d.h. 5 pixel Abstand zum Rand ringsum
 +
* margin: - Begrenzungswerte des Rahmens vom Seitenrand
 +
** 0 - Abstand nach oben zum vorhergehenden Text
 +
** 300 - Abstand vom rechten Rand
 +
** 0 - Abstand nach unten zum nachfolgenden Text
 +
** 100 - Abstand vom linken Rand
 +
*** oder: margin-right:300px - d.h. nur ein abstand von rechten Rand von 300 pixeln
 +
*background-color: - Farbe
 
** #f8f8ff - Farbnummer
 
** #f8f8ff - Farbnummer
 +
 +
====Wie mache ich zwei oder mehrere Rahmen nebeneinander?====
 +
z.B. sieht so der Quelltext aus:
 +
<pre>
 +
<div style="border:1px solid grey; width:45%; padding:5px; float:left; background-color:magenta; height: 20px">
 +
* wurst
 +
* käse
 +
* gemüse
 +
</div>
 +
div style="border: 1px solid grey; width: 30%; margin-left: 65%; padding: 5px;background-color:orange; height: 75px">
 +
* saft
 +
* bier
 +
* wein
 +
</div>
 +
</pre>
 +
 +
:Das sieht dann z.B. so aus:
 +
 +
<div style="border:1px solid grey; width:30%; padding:5px; float:left; background-color:magenta; height: 75px">
 +
* wurst
 +
* käse
 +
* gemüse
 +
</div>
 +
<div style="border: 1px solid grey; width: 30%; margin-left: 65%; padding: 5px;background-color:orange; height: 75px">
 +
* saft
 +
* bier
 +
* wein
 +
</div>
 +
 +
:Erklärung:
 +
* style: border - Fenster oder Umrandungslinie
 +
** 1px solid grey - 1Pixel stark durchgezogene Linie graue Umrandung
 +
* padding: - Abstand
 +
** 5px - Abstand zwischen Rand und Text d.h. 5 pixel Abstand zum Rand ringsum
 +
*float: left - am linken rand postiert(fliessend)
 +
* margin-left: - Begrenzungswerte des Rahmens vom linken Seitenrand
 
*background-color: - Farbe
 
*background-color: - Farbe
**  
+
** orange,magenta - Farbe
<div style="border: 1px dotted red; padding: 5px; margin: 0px 0px 20px 0px;background-color:#f8f8ff;">
+
*es sind auch Hexadezimalfarben möglich, einfach den code angeben, z.B.:
Na ihr Plinsen
+
** weiss - #FFFFFF
 +
** rot - #FF0000
 +
*alle Farben mit Nummern gibts [http://de.selfhtml.org/helferlein/farben.htm hier]
  
Heute noch gar nicht´s verändert?
+
====Wie mache ich einen Rahmen in einem anderen Rahmen?====
</div>
+
z.B. sieht so der Quelltext aus:

Aktuelle Version vom 30. Dezember 2006, 12:29 Uhr

Rahmen

Wie mache ich einen Rahmen?

z.B. sieht so der Quelltext aus:

<div style="border: 5px dotted green; padding: 5px; margin: 0px 300px 0px 100px;background-color:#f8f8ff;">
:Na ihr Plinsen. Heute noch gar nicht´s verändert?
</div>
Das sieht dann z.B. so aus:
Na ihr Plinsen. Heute noch gar nicht´s verändert?
Erklärung:
  • style: border - Fenster oder Umrandungslinie
    • 1px dotted green - 1Pixel stark gepunktete grüne Umrandung
      • oder: 1px solid green - 1Pixel stark durchgezogene Linie grüne Umrandung
  • padding: - Abstand
    • 5px - Abstand zwischen Rand und Text d.h. 5 pixel Abstand zum Rand ringsum
  • margin: - Begrenzungswerte des Rahmens vom Seitenrand
    • 0 - Abstand nach oben zum vorhergehenden Text
    • 300 - Abstand vom rechten Rand
    • 0 - Abstand nach unten zum nachfolgenden Text
    • 100 - Abstand vom linken Rand
      • oder: margin-right:300px - d.h. nur ein abstand von rechten Rand von 300 pixeln
  • background-color: - Farbe
    • #f8f8ff - Farbnummer

Wie mache ich zwei oder mehrere Rahmen nebeneinander?

z.B. sieht so der Quelltext aus:

<div style="border:1px solid grey; width:45%; padding:5px; float:left; background-color:magenta; height: 20px">
* wurst
* käse
* gemüse
</div>
div style="border: 1px solid grey; width: 30%; margin-left: 65%; padding: 5px;background-color:orange; height: 75px">
* saft
* bier
* wein
</div>
Das sieht dann z.B. so aus:
  • wurst
  • käse
  • gemüse
  • saft
  • bier
  • wein
Erklärung:
  • style: border - Fenster oder Umrandungslinie
    • 1px solid grey - 1Pixel stark durchgezogene Linie graue Umrandung
  • padding: - Abstand
    • 5px - Abstand zwischen Rand und Text d.h. 5 pixel Abstand zum Rand ringsum
  • float: left - am linken rand postiert(fliessend)
  • margin-left: - Begrenzungswerte des Rahmens vom linken Seitenrand
  • background-color: - Farbe
    • orange,magenta - Farbe
  • es sind auch Hexadezimalfarben möglich, einfach den code angeben, z.B.:
    • weiss - #FFFFFF
    • rot - #FF0000
  • alle Farben mit Nummern gibts hier

Wie mache ich einen Rahmen in einem anderen Rahmen?

z.B. sieht so der Quelltext aus: