Seitenlayout 1: Unterschied zwischen den Versionen
Aus RMG-Wiki
K (hat „Fortbildung/Seitenlayout 1“ nach „Fortbildung 2008/Seitenlayout 1“ verschoben) |
|||
(74 dazwischenliegende Versionen von 4 Benutzern werden nicht angezeigt) | |||
Zeile 1: | Zeile 1: | ||
− | = | + | [[Fortbildung| ''zur Fortbildung zurück'']] |
+ | __NOTOC__ | ||
+ | =Positionierung von Text und Bild mit Hilfe einer Tabelle= | ||
{| | {| | ||
− | | Spalte | + | |width="30%" |Hier können Sie einen echten Text einfügen. Das zugehörige Bild steht nebenan. Dieser Text kann auch länger sein. |
+ | Die verwendete Tabelle hat drei Spalten, wobei die mittlere leer und sehr schmal ist, und nur den notwendigen Abstand zwischen Text und Bild sicherstellt. | ||
+ | |width="3%"|<!--Diese Spalte bleibt leer und legt den Abstand zwischen Text und Bild fest--> | ||
+ | |valign="top" |[[Bild:RMG.jpg]] | ||
+ | |} | ||
+ | |||
+ | <pre> | ||
+ | {| | ||
+ | |width="30%" |Hier können Sie einen echten Text einfügen. Das zugehörige Bild steht nebenan. | ||
+ | Dieser Text kann auch länger sein. | ||
+ | Die verwendete Tabelle hat drei Spalten, wobei die mittlere leer und sehr schmal ist, | ||
+ | und nur den notwendigen Abstand zwischen Text und Bild sicherstellt. | ||
+ | |width="3%"|<!--Diese Spalte bleibt leer und legt den Abstand zwischen Text und Bild fest--> | ||
+ | |valign="top" |[[Bild:RMG.jpg]] | ||
+ | |} | ||
+ | </pre> | ||
+ | |||
+ | =Anlegen einer zweispaltigen Seite= | ||
+ | {| width="99%" | ||
+ | | style="vertical-align:top" | | ||
+ | <div style="margin: 0; margin-right:10px; border: 1px solid #dfdfdf; padding: 0em 1em 1em 1em; background-color:#F5F5F5; align:left;"> | ||
+ | == Deutsch == | ||
+ | Der Hund bellt | ||
+ | |||
+ | </div> | ||
+ | | width="50%" style="vertical-align:top" | | ||
+ | <div style="margin:0; border:1px solid #dfdfdf; padding: 0em 1em 1em 1em; background-color:#F5F5F5; align:left;"> | ||
+ | == Englisch== | ||
+ | The dog barks | ||
+ | |||
+ | </div> | ||
+ | |} | ||
+ | <pre> | ||
+ | {| width="99%" | ||
+ | | style="vertical-align:top" | | ||
+ | <div style="margin: 0; margin-right:10px; border: 1px solid #dfdfdf; | ||
+ | padding: 0em 1em 1em 1em; background-color:#F5F5F5; align:left;"> | ||
+ | == Deutsch == | ||
+ | Der Hund bellt | ||
+ | |||
+ | </div> | ||
+ | | width="50%" style="vertical-align:top" | | ||
+ | <div style="margin:0; border:1px solid #dfdfdf; padding: 0em 1em 1em 1em; | ||
+ | background-color:#F5F5F5; align:left;"> | ||
+ | == Englisch== | ||
+ | The dog barks | ||
+ | |||
+ | </div> | ||
+ | |} | ||
+ | </pre> | ||
+ | |||
+ | =Einfache Tabellen= | ||
+ | {| | ||
+ | | Spalte A | ||
*1.1 | *1.1 | ||
*1.2 | *1.2 | ||
− | | Spalte | + | | Spalte B |
*2.1 | *2.1 | ||
*2.2 | *2.2 | ||
− | | Spalte | + | | Spalte C |
*3.1 | *3.1 | ||
*3.2 | *3.2 | ||
|} | |} | ||
+ | <pre> | ||
+ | {| | ||
+ | | Spalte A | ||
+ | *1.1 | ||
+ | *1.2 | ||
+ | | Spalte B | ||
+ | *2.1 | ||
+ | *2.2 | ||
+ | | Spalte C | ||
+ | *3.1 | ||
+ | *3.2 | ||
+ | |} | ||
+ | </pre> | ||
+ | |||
+ | =Formatierung von Tabellen= | ||
− | == | + | ==Zweizeilige Tabelle mit Rahmen und bestimmter Spaltenbreite== |
− | {|border="1" | + | {| border="1" cellspacing="0" valign="top" |
− | | width=" | + | | width="5%" | A1 |
− | | width=" | + | | width="10%" | B1 |
− | | width=" | + | | width="20%" | C1 |
− | |- | + | |-valign="top" |
− | |A2 | + | | A2 |
− | |B2 | + | | B2 |
− | | | + | | [[Bild:theli3.jpg]] |
|} | |} | ||
+ | <pre> | ||
+ | {| border="1" cellspacing="0" valign="top" | ||
+ | | width="5%" | A1 | ||
+ | | width="10%" | B1 | ||
+ | | width="20%" | C1 | ||
+ | |-valign="top" | ||
+ | | A2 | ||
+ | | B2 | ||
+ | | [[Bild:theli3.jpg]] | ||
+ | |} | ||
+ | </pre> | ||
− | + | ||
− | {|style="background:#C4C4C4" border="1" | + | ==Tabelle mit Rahmen, Spaltenbreite, Hintergrundfarbe und Textfarbe== |
+ | {|style="background:#C4C4C4" border="1" cellspacing="0" cellpadding="4" | ||
|style="vertical-align:top" ; width="50%"| | |style="vertical-align:top" ; width="50%"| | ||
<span style="color:#990000">Erste Spalte | <span style="color:#990000">Erste Spalte | ||
Zeile 35: | Zeile 117: | ||
|} | |} | ||
− | === | + | <pre> |
− | * Kopieren Sie den Quelltext einer Tabelle, die Ihnen gefällt. | + | {|style="background:#C4C4C4" border="1" cellspacing="0" cellpadding="4" |
− | * | + | |style="vertical-align:top" ; width="50%"| |
+ | <span style="color:#990000">Erste Spalte | ||
+ | |style="vertical-align:top" ; width="25%"| | ||
+ | <span style="color:#009900">Zweite Spalte | ||
+ | |style="vertical-align:top" ; width="25%"| | ||
+ | <span style="color:#000099">Dritte Spalte | ||
+ | |} | ||
+ | </pre> | ||
+ | |||
+ | |||
+ | |||
+ | =Tipps= | ||
+ | * Kopieren Sie den Quelltext einer Tabelle, die Ihnen gefällt. Gehen Sie dazu auf den zur Tabelle gehörenden "Bearbeiten"-Link rechts, markieren Sie den Quelltext im "Bearbeiten"- Fenster und fügen Sie diesen auf Ihrer Seite ein! | ||
+ | * [http://wiki.zum.de/Hilfe:Tabellen Tabellen (Hilfe im ZUM-WIKI)] |
Aktuelle Version vom 4. November 2010, 22:03 Uhr
Positionierung von Text und Bild mit Hilfe einer Tabelle
{| |width="30%" |Hier können Sie einen echten Text einfügen. Das zugehörige Bild steht nebenan. Dieser Text kann auch länger sein. Die verwendete Tabelle hat drei Spalten, wobei die mittlere leer und sehr schmal ist, und nur den notwendigen Abstand zwischen Text und Bild sicherstellt. |width="3%"|<!--Diese Spalte bleibt leer und legt den Abstand zwischen Text und Bild fest--> |valign="top" |[[Bild:RMG.jpg]] |}
Anlegen einer zweispaltigen Seite
DeutschDer Hund bellt |
EnglischThe dog barks |
{| width="99%" | style="vertical-align:top" | <div style="margin: 0; margin-right:10px; border: 1px solid #dfdfdf; padding: 0em 1em 1em 1em; background-color:#F5F5F5; align:left;"> == Deutsch == Der Hund bellt </div> | width="50%" style="vertical-align:top" | <div style="margin:0; border:1px solid #dfdfdf; padding: 0em 1em 1em 1em; background-color:#F5F5F5; align:left;"> == Englisch== The dog barks </div> |}
Einfache Tabellen
Spalte A
|
Spalte B
|
Spalte C
|
{| | Spalte A *1.1 *1.2 | Spalte B *2.1 *2.2 | Spalte C *3.1 *3.2 |}
Formatierung von Tabellen
Zweizeilige Tabelle mit Rahmen und bestimmter Spaltenbreite
A1 | B1 | C1 |
A2 | B2 | Datei:Theli3.jpg |
{| border="1" cellspacing="0" valign="top" | width="5%" | A1 | width="10%" | B1 | width="20%" | C1 |-valign="top" | A2 | B2 | [[Bild:theli3.jpg]] |}
Tabelle mit Rahmen, Spaltenbreite, Hintergrundfarbe und Textfarbe
Erste Spalte |
Zweite Spalte |
Dritte Spalte |
{|style="background:#C4C4C4" border="1" cellspacing="0" cellpadding="4" |style="vertical-align:top" ; width="50%"| <span style="color:#990000">Erste Spalte |style="vertical-align:top" ; width="25%"| <span style="color:#009900">Zweite Spalte |style="vertical-align:top" ; width="25%"| <span style="color:#000099">Dritte Spalte |}
Tipps
- Kopieren Sie den Quelltext einer Tabelle, die Ihnen gefällt. Gehen Sie dazu auf den zur Tabelle gehörenden "Bearbeiten"-Link rechts, markieren Sie den Quelltext im "Bearbeiten"- Fenster und fügen Sie diesen auf Ihrer Seite ein!
- Tabellen (Hilfe im ZUM-WIKI)