http://www.doku.papoo.de/index.php?action=history&feed=atom&title=Papoo_CSS_Layout 2026-04-13T09:40:30Z Versionsgeschichte dieser Seite in Papoo Dokumentation MediaWiki 1.18.1 http://www.doku.papoo.de/index.php?title=Papoo_CSS_Layout&diff=2577&oldid=prev 2006-08-20T21:35:25Z

<p></p> <table class='diff diff-contentalign-left'> <col class='diff-marker' /> <col class='diff-content' /> <col class='diff-marker' /> <col class='diff-content' /> <tr valign='top'> <td colspan='2' style="background-color: white; color:black;">Nächstältere Version→</td> <td colspan='2' style="background-color: white; color:black;">Version vom 21:35, 20. Aug 2006</td> </tr><tr><td colspan="2" class="diff-lineno">Zeile 11:</td> <td colspan="2" class="diff-lineno">Zeile 11:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>==Struktur des Layouts==</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>==Struktur des Layouts==</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Die generelle Struktur ist ein klassischer 3 Spalter, der allerdings zusammen mit dem Modulmanger in beliebige andere Layouts umgewandelt werden kann.</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Die generelle Struktur ist ein klassischer 3 Spalter, der allerdings zusammen mit dem Modulmanger in beliebige andere Layouts umgewandelt werden kann.</div></td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div>&#160;</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">==HTML Grundgerüst==</ins></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Um das CSS Layout zu verstehen, muß zuerst das HTML Grundgerüst erklärt werden.</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Um das CSS Layout zu verstehen, muß zuerst das HTML Grundgerüst erklärt werden.</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* [[HTML Grundgerüst]]</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* [[HTML Grundgerüst]]</div></td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div>&#160;</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">==CSS Grundgerüst==</ins></div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Anschließend kann dann näher auf die Positionierung und Anwendung des CSS eingegangen werden.</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Anschließend kann dann näher auf die Positionierung und Anwendung des CSS eingegangen werden.</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* [[CSS Grundgerüst]]</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* [[CSS Grundgerüst]]</div></td></tr> </table>

Carsten Euwens http://www.doku.papoo.de/index.php?title=Papoo_CSS_Layout&diff=2576&oldid=prev 2006-08-20T21:34:56Z

<p></p> <table class='diff diff-contentalign-left'> <col class='diff-marker' /> <col class='diff-content' /> <col class='diff-marker' /> <col class='diff-content' /> <tr valign='top'> <td colspan='2' style="background-color: white; color:black;">Nächstältere Version→</td> <td colspan='2' style="background-color: white; color:black;">Version vom 21:34, 20. Aug 2006</td> </tr><tr><td colspan="2" class="diff-lineno">Zeile 17:</td> <td colspan="2" class="diff-lineno">Zeile 17:</td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Anschließend kann dann näher auf die Positionierung und Anwendung des CSS eingegangen werden.</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>Anschließend kann dann näher auf die Positionierung und Anwendung des CSS eingegangen werden.</div></td></tr> <tr><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* [[CSS Grundgerüst]]</div></td><td class='diff-marker'>&#160;</td><td style="background: #eee; color:black; font-size: smaller;"><div>* [[CSS Grundgerüst]]</div></td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;"></del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">Aufgeteilt ist das HTML Grundgerüst, das ja die Struktur für das Layout bildet in:</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">* Kopf</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">* linke Spalte</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">* mittlere Spalte</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">* rechte Spalte</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">* Fuß</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;"></del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;">Das wird auch reflektiert in der /templates/__index.html</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;"> {include file=&quot;_kopf.html&quot;}</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;"> {include file=&quot;_inhalt_links.html&quot;}</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;"> {include file=&quot;_inhalt_rechts.html&quot;}</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;"> {include file=&quot;_inhalt_mitte.html&quot;}</del></div></td><td colspan="2">&#160;</td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del style="color: red; font-weight: bold; text-decoration: none;"> {include file=&quot;_fuss.html&quot;}</del></div></td><td colspan="2">&#160;</td></tr> </table>

Carsten Euwens http://www.doku.papoo.de/index.php?title=Papoo_CSS_Layout&diff=2574&oldid=prev 2006-08-20T21:33:08Z

<p></p> <table class='diff diff-contentalign-left'> <col class='diff-marker' /> <col class='diff-content' /> <col class='diff-marker' /> <col class='diff-content' /> <tr valign='top'> <td colspan='2' style="background-color: white; color:black;">Nächstältere Version→</td> <td colspan='2' style="background-color: white; color:black;">Version vom 21:33, 20. Aug 2006</td> </tr><tr><td colspan="2" class="diff-lineno">Zeile 1:</td> <td colspan="2" class="diff-lineno">Zeile 1:</td></tr> <tr><td class='diff-marker'>−</td><td style="background: #ffa; color:black; font-size: smaller;"><div><del class="diffchange diffchange-inline">Diese </del>Informationen <del class="diffchange diffchange-inline">werden </del>zur Zeit <del class="diffchange diffchange-inline">noch bearbeitet</del>.</div></td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">&lt;div class=&quot;breadcrump&quot;&gt;Sie sind hier: [[Hauptseite]] / [[Papoo CSS Layout]]&lt;/div&gt;</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">=CSS Layout=</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">Sie finden hier </ins>Informationen <ins class="diffchange diffchange-inline">über die Struktur des CSS Layouts. </ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>&#160;</div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">==Basis des Layouts==</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">Als Basis des Layouts dient </ins>zur Zeit <ins class="diffchange diffchange-inline">das [http://www.yaml.de YAML] CSS Framwork von Dirk Jesse.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">Das gesamte Layout des Papoo CMS ist in Blöcken realisiert, die auch jeweils in eigenen div Blöcken gekapselt sind. Man kann natürlich argumentieren, das diese Kapselung zu viel HTML Overhead produziert, allerdings erreicht man dadurch auch eine enorme Flexibilität.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">&lt;br /&gt;&lt;br /&gt;</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">Durch diese Kapselung konnte für Papoo auch sehr einfach das YAML Layout übernommen werden. Wir mußten dazu lediglich einige div Blöcke umbenennen.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>&#160;</div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">==Struktur des Layouts==</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">Die generelle Struktur ist ein klassischer 3 Spalter, der allerdings zusammen mit dem Modulmanger in beliebige andere Layouts umgewandelt werden kann.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>&#160;</div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">Um das CSS Layout zu verstehen, muß zuerst das HTML Grundgerüst erklärt werden.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* [[HTML Grundgerüst]]</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>&#160;</div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">Anschließend kann dann näher auf die Positionierung und Anwendung des CSS eingegangen werden.</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* [[CSS Grundgerüst]]</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>&#160;</div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">Aufgeteilt ist das HTML Grundgerüst, das ja die Struktur für das Layout bildet in:</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* Kopf</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* linke Spalte</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* mittlere Spalte</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* rechte Spalte</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">* Fuß</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div>&#160;</div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline">Das wird auch reflektiert in der /templates/__index.html</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline"> {include file=&quot;_kopf.html&quot;}</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline"> {include file=&quot;_inhalt_links.html&quot;}</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline"> {include file=&quot;_inhalt_rechts.html&quot;}</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline"> {include file=&quot;_inhalt_mitte.html&quot;}</ins></div></td></tr> <tr><td colspan="2">&#160;</td><td class='diff-marker'>+</td><td style="background: #cfc; color:black; font-size: smaller;"><div><ins class="diffchange diffchange-inline"> {include file=&quot;_fuss</ins>.<ins class="diffchange diffchange-inline">html&quot;}</ins></div></td></tr> </table>

Carsten Euwens http://www.doku.papoo.de/index.php?title=Papoo_CSS_Layout&diff=2511&oldid=prev 2006-08-04T08:32:11Z

<p></p> <p><b>Neue Seite</b></p><div>Diese Informationen werden zur Zeit noch bearbeitet.</div>

Carsten Euwens