archive-de.com » DE » E » EKIWI.DE

Total: 422

Choose link from "Titles, links and description words view":

Or switch to "Titles and links view".
  • SELFHTML: Stylesheets / CSS-basierte Layouts / Einführung
    Bedeutung Diese Entwicklung wird nicht zuletzt von der Gesetzgebung betreffend Internetpräsenzen die unter staatlicher Aufsicht stehen gefördert Darüber hinaus erleichtern CSS Layouts die Pflege der Seiten und reduzieren den Umfang des HTML Quelltextes und damit die Ladezeiten deutlich Das Box Modell als Grundlage CSS basierter Layouts Versuchen Sie bitte nicht die Struktur eines Tabellen Layouts mit ineinander verschachtelten div Elementen nachzubauen Sie können jedem Block Element die erforderlichen CSS Eigenschaften float width und margin zuweisen und benötigen div Tags lediglich zur Gruppierung von Elementen Die CSS Eigenschaft position sollten Sie für CSS Layouts nur im Ausnahmefall verwenden und die hierdurch mögliche Überlagerung von Elementen bei Schriftvergrößerung sowie die Platzierung außerhalb des sichtbaren Bereichs in kleinen Browserfenstern berücksichtigen Ein Block Element nimmt die gesamte zur Verfügung stehende Breite ein es sei denn eine geringere Breite wird über width zugewiesen Wenn in diesem Fall noch ausreichend Platz zur Verfügung steht können weitere Elemente über float daneben platziert werden Um dabei einen Textumfluss des Elements zu vermeiden kann es über margin auf Abstand gehalten werden Im Gegensatz zu den Zellen in einer Tabellenspalte stellt jedes Block Element hier eine von den nebenstehenden Elementen unabhängige Box dar wie dieses Beispiel verdeutlicht div style float left width 5em border 2px solid gray links floatende Box div div style border 2px solid blue nachfolgende Box div links floatende Box nachfolgende Box Erläuterung Für die linke Box ist float und width definiert Der Textinhalt der nachfolgenden Box steht daneben die Box selbst nimmt in diesem Beispiel die gesamte Fensterbreite ein Auch die Höhe einer Box richtet sich sofern sie nicht explizit zugewiesen ist nach ihrem Inhalt und wird nicht von der Höhe einer nebenstehend platzieren Box beeinflusst Eine Spaltenaufteilung mit durchgängigen Hintergrundfarben die in Tabellen Layouts leicht zu realisieren ist lässt sich daher in einem CSS Layout

    Original URL path: http://html.ekiwi.de/css/layouts/einfuehrung.htm (2016-04-25)
    Open archived version from archive


  • SELFHTML: Stylesheets / CSS-basierte Layouts / Mehrspaltige Layouts
    href einfuehrung htm Einführung in CSS basierte Layouts a li li a href mehrspaltige htm Mehrspaltige CSS basierte Layouts a li li a href fixbereiche htm Fixe Bereiche mit CSS basierten Layouts a li li a href navigationsleisten htm CSS basierte Navigationsleisten a li li a href browserweichen htm CSS Browserweichen a li ul div id Info strong Info Box strong p Auch wenn diese Info Box am Bildschirm als letzte angezeigt wird ist sie im Quelltext vor dem im Fluss belassenem Inhaltsbereich zu notieren p p Dadurch dass für den Inhaltsbereich kein float definiert ist kann auf die Angabe einer Breite verzichtet werden und die Seite den ihr zur Verfügung stehenden Raum ausnutzen p p Diese Methode ein Element im Fluss zu belassen und dadurch auf eine Breitenangabe verzichten zu können hat außerdem den Vorteil Abweichungen durch das falsche Box Modell des Internet Explorer auszugleichen p div div id Inhalt h1 CSS basierte Layouts h1 h2 3 spaltiges Layout h2 p In diesem Beispiel ist die Breite der Navigation etwas reduziert um einer zusätzlichen Info Box an der rechten Seite Platz zu machen die Schriftgröße der Navigation und Info Box ist etwas verringert um den relativ geringen Breiten Rechnung zu tragen p p Nur für die äußeren Boxen ist eine Breite und float angegeben Durch die Angabe der Breiten relativ zur Schriftgröße in em können sich die Boxen einer Änderung des Schriftgrades anpassen p p Dieser mittlere Inhaltsbereich wird über seitliches margin auf Abstand gehalten und passt sich flexibel an die Fensterbreite an p div body html Erläuterung Um mehrere Boxen über float nebeneinander zu setzen kann bei einer Box hier dem Inhaltsbereich auf die Definition von float und width verzichtet werden Hierdurch nimmt sie den gesamten zur Verfügung stehenden Raum ein Dies erfordert allerdings die floatenden Boxen vorher in den Quelltext zu setzen damit sie zuerst ihre definierte Breite reservieren können Damit der Inhaltsbereich die nebenstehenden Boxen nicht umfließt wird er über margin left und margin right eingegrenzt Die Werte für margin beziehen sich auf die Seitenränder und entsprechen den Breiten der nebenstehenden aus dem Fluss genommenen Boxen zuzüglich einem hierzu gewünschten Abstand Falls Sie sich wundern warum der Wert von margin hier gleich oder sogar kleiner als der Wert von width für die nebenstehenden Boxen ist und sich trotzdem ein Abstand ergibt die verwendete Einheit em ist bei Längenangaben abhängig von der Schriftgröße des Elements diese ist für den Inhaltsbereich größer definiert Über eine geeignete Angabe zu min width kann in modernen Browsern bei zu schmalen Fenstern ein Umbruch der Boxen verhindert werden Anhand des Beispiels sehen Sie auch dass sich Boxen nicht gegenseitig in ihrer Höhe beeinflussen Dies muss kein Nachteil sein sondern kann bewusst zur Gestaltung der Seite eingesetzt werden erfordert allerdings ein Umdenken und die Abkehr vom althergebrachten Spaltendenken bei Tabellen Layouts Beachten Sie Die für ein Element in em angegebene Schriftgröße wird an darin enthaltene Elemente vererbt In diesem Beispiel ist für div Info die Schriftgröße mit font size 0 9em angegeben Der für div Info strong erhöhte Wert font size 1 33em ergibt nach Anwendung auf die zuvor notierte Größe von 0 9em als Resultat 1 197em 0 9 mal 1 33 was in etwa der für div Inhalt h2 mit font size 1 2em angegebenen Schriftgröße entspricht Berücksichtigen Sie die Vererbung bei allen verschachtelten Elementen denen Sie eine von 1em oder 100 abweichende Schriftgröße mittels relativer Einheiten zuweisen Sie können sich den Umrechnungsaufwand ersparen wenn Sie nur für die äußersten oder nur für die innersten Elemente eine Schriftgröße angeben Im ersten Fall wird die Schriftgröße an alle enthaltenen Elemente vererbt wobei der Internet Explorer allerdings mit der Vererbung auf Tabellenzellen Probleme hat und im zweiten Fall ist die Basis für die Schriftgröße der innersten Elemente dieselbe Die Problematik der Vererbung stellt sich nicht wenn Sie die Einheit px für Schriftgrößen verwenden Allerdings haben Sie dann auch nicht mehr die Möglichkeit die Längenangaben passend zur Schriftgröße in em anzugeben damit sich das Layout an den jeweils eingestellten Schriftgrad anpasst Darüber hinaus unterbindet der Einsatz von px die Anpassung von Schriftgrößen im Internet Explorer was eine Barriere für Benutzer darstellen kann Mehrspaltiges Layout mit Kopf und Fußzeile Viele Layouts werden von einem Header und einem Footer umschlossen wobei in der Kopfzeile die Seitenüberschrift oder ein grafischer Banner platziert wird und die Fußzeile eine Copyright Angabe oder allgemeine Links z B nach oben Impressum oder Sitemap enthält Dies hat für CSS Layouts auch praktische Vorteile Die Kopfzeile wird am Anfang des Quelltextes notiert und als Seitenüberschrift mit h1 ausgezeichnet was in den folgenden Boxen die hierarchisch korrekte Verwendung von Überschriften zweiten Grades ermöglicht Über die CSS Eigenschaft clear der Fußzeile wird der Umfluss float der seitlich platzierten Elemente aufgehoben was z B bei Verwendung eines Seitenhintergrundes erforderlich sein kann wie das letzte Beispiel zeigen wird Außerdem beinhalten diese beiden Beispiele einen Workaround für den Internet Explorer bis Version 6 gegen die um 3px erweiterte Einrückung des Textes neben der Navigation Das folgende Beispiel erweitert das vorangegangene dreispaltige Layout um eine Kopf und Fußzeile Beispiel Anzeigebeispiel So sieht s aus DOCTYPE HTML PUBLIC W3C DTD HTML 4 01 EN http www w3 org TR html4 strict dtd html head title Dreispaltiges Layout mit Kopf und Fußzeile title style type text css body color black background color white font size 100 01 font family Helvetica Arial sans serif margin 0 padding 1em min width 41em Mindestbreite verhindert Umbruch und Anzeigefehler in modernen Browsern h1 font size 1 5em margin 0 0 0 7em padding 0 3em text align center background color fed border 2px ridge silver ul Navigation font size 0 83em float left width 18em margin 0 0 1 2em padding 0 border 1px dashed silver ul Navigation li list style none margin 0 padding 0 5em ul Navigation a display block padding 0 2em font weight bold ul Navigation a link color black background color eee ul Navigation a visited color 666 background color eee ul Navigation a hover color black background color white

    Original URL path: http://html.ekiwi.de/css/layouts/mehrspaltige.htm (2016-04-25)
    Open archived version from archive

  • SELFHTML: Stylesheets / CSS-basierte Layouts / Fixe Bereiche
    Links html padding 0 body margin 0 padding 0 fixiert position absolute top 2 8em left 2em width 18em background color white border 1px solid silver html body fixiert nur fuer moderne Browser position fixed fixiert img height 6 8em float right Inhalt margin left 22em padding 0 1em border left 2px ridge gray border top 2px ridge gray Inhalt versteckt vor Netscape 4 background color ffffe0 Inhalt h2 font size 1 2em margin 2em 5 2em color maroon border bottom 1px solid silver Inhalt p font size 1em margin 1em 0 Inhalt Fusszeile font size 0 9em margin 200em 0 0 padding 0 1em text align center background color fed border 1px solid silver h1 font size 1 5em margin 0 5em padding 0 3em text align center background color fed border 2px ridge gray Navigation font size 0 83em margin 0 0 1 2em padding 0 Navigation li list style none margin 0 padding 0 5em ul Navigation a display block padding 0 2em font weight bold ul Navigation a link color black background color eee ul Navigation a visited color 666 background color eee ul Navigation a hover color black background color white ul Navigation a active color white background color gray style head body div id Scrollbereich erst fuer den folgenden Workaround benoetigt h1 Fixierte Navigation h1 div id Inhalt h2 Beispiel nur für moderne Browser h2 p In diesem Beispiel ist die linke Navigation zunächst absolut positioniert und wird anschließend über eine Browserweiche nur für moderne Browser fixiert Hierdurch kommt es in älteren Browsern zu keinen Fehldarstellungen und auch diese setzen die erst am Ende des Quelltextes notierte Navigation nach oben p p Für dieses Beispiel ist das quot mehrspaltige Layout mit Kopf und Fußzeile quot der vorherigen Seite etwas modifiziert worden Es passt sich der Fenster und Schriftgröße an und sogar das SELFHTML Logo wächst durch die Höhenangabe in strong em strong mit einer Schriftvergrößerung p p Beachten Sie dass der fixierte Bereich teilweise unzugänglich wird wenn die Höhe des Browserfensters sehr stark verringert und oder die Schriftgröße heraufgesetzt wird p p id Fusszeile Sie haben tatsächlich bis hierhin gescrollt p div div div id fixiert verhindert auch Anzeigefehler einer fixierten ul ul id Navigation li a href einfuehrung htm Einführung in CSS basierte Layouts a li li a href mehrspaltige htm Mehrspaltige CSS basierte Layouts a li li a href fixbereiche htm Fixe Bereiche mit CSS basierten Layouts a li li a href navigationsleisten htm CSS basierte Navigationsleisten a li li a href browserweichen htm CSS Browserweichen a li ul img src src logo gif alt SELFHTML p a href fixbereiche htm definieren zurück a p div body html Erläuterung Dieses Beispiel zeigt wie simpel eine fixierte Navigation zu realisieren wäre wenn der Internet Explorer den bereits 1998 veröffentlichten Standard CSS 2 nicht erst acht Jahre später ab Version 7 hinreichend unterstützen würde Andererseits interpretiert der Internet Explorer schon seit Version 5 0 eine CSS Eigenschaft die für CSS3 zu erwarten ist und

    Original URL path: http://html.ekiwi.de/css/layouts/fixbereiche.htm (2016-04-25)
    Open archived version from archive

  • SELFHTML: Stylesheets / CSS-basierte Layouts / Navigationsleisten
    background color ffffe0 ul Navigation margin 0 padding 0 8em text align center border 1px solid black background color silver ul Navigation li list style none display inline margin 0 padding 0 ul Navigation a ul Navigation span float left width 6em margin 0 4em padding 0 2em 1em text decoration none font weight bold border 1px solid black border left color white border top color white color maroon background color ccc html ul Navigation a html ul Navigation span Korrektur fuer IE 5 x width 8em w idth 6em ul Navigation a hover ul Navigation span border color white border left color black border top color black color white background color gray ul Navigation div clear left style head body h1 id Beispiel Horizontale Navigationsleiste mit gleichen Breiten h1 ul id Navigation li a href Beispiel Seite nbsp 1 a li li a href Beispiel Seite nbsp 2 a li li a href Beispiel Seite nbsp 3 a li li span aktuelle nbsp Seite span li li a href Beispiel Seite nbsp 5 a div div li ul body html Erläuterung Auch in diesem Beispiel wird display inline für die li Elemente benötigt um Zeilenumbrüche zu verhindern Da die enthaltenen Menüpunkte über float Eigenschaften von Block Elementen erhalten können ihnen auch eine Breite width und Außenabstände margin zugewiesen werden ferner kommt es bei einem Umbruch nicht mehr zu Überlagerungen Um den Elementfluss wieder herzustellen und in diesem Beispiel die Menüpunkte mit Hintergrund und Rahmen der Liste zu umschließen ist ein Element mit der CSS Eigenschaft clear innerhalb der Liste erforderlich Hierzu wird ein leeres div Element ohne semantische Bedeutung verwendet Beim Internet Explorer funktioniert dies allerdings nur solange kein Umbruch der Navigationsleiste erfolgt Sie können der Navigationsleiste ul Navigation auch eine passende Breite zuweisen um in zu kleinen Browserfenstern statt eines Umbruchs Scrollbalken anzubieten Gemäß CSS 2 1 können Sie float hier auch problemlos ohne Angabe einer Breite verwenden um Überlagerungen bei einem Umbruch zu verhindern Mehrere Navigationsebenen Eine Navigation die wie in obigem Beispiel mit Zwischenüberschriften versehen ist wird in vielen Fällen keine sequenzielle Auflistung von Links enthalten sondern eher verschiedenen Navigationsebenen entsprechen Die Überschriften stellen in diesem Fall die Hauptmenüpunkte dar und können selbst auch mit Übersichtsseiten für die jeweilige Rubrik verlinkt sein Eine verschachtelte Liste eignet sich zur logischen Abbildung dieser Struktur jedoch besser Beispiel Anzeigebeispiel So sieht s aus DOCTYPE HTML PUBLIC W3C DTD HTML 4 01 EN http www w3 org TR html4 strict dtd html head title Navigationsleiste mit mehreren Ebenen title style type text css body font normal 100 01 Helvetica Arial sans serif color black background color ffffe0 ul Navigation width 10em margin 0 padding 0 8em border 1px solid black background color silver html ul Navigation Korrekturen fuer IE 5 x width 11 6em w idth 10em padding left 0 padd ing left 0 8em ul Navigation li list style none margin 0 4em padding 0 ul Navigation li ul margin 0 0 0 1em padding 0 ul Navigation li ul li margin 0 1em 0 html ul Navigation li ul li Korrektur fuer IE 5 x margin left 1em ma rgin left 0 ul Navigation a display block padding 0 2em text decoration none font weight bold border 1px solid black border left color white border top color white color maroon background color ccc html ul Navigation a width 100 Breitenangabe fuer IE 5 x w idth 8 8em Breitenangabe fuer IE 6 html ul Navigation li ul li a width 100 Breitenangabe fuer IE 5 x w idth 7 8em Breitenangabe fuer IE 6 ul Navigation a hover border color white border left color black border top color black color white background color gray style head body h1 id Beispiel Mehrere Navigationsebenen h1 ul id Navigation li a href Beispiel Seite 1 a li li a href Beispiel Seite 2 a ul li a href Beispiel Seite 2a a li li a href Beispiel Seite 2b a li li a href Beispiel Seite 2c a li ul li li a href Beispiel Seite 3 a li li a href Beispiel Seite 4 a li ul body html Erläuterung In das zweite li Element ist hier eine weitere Liste eingefügt da ul selbst keine anderen Elemente als li enthalten darf Über die Nachkommen Selektoren ul Navigation li ul und ul Navigation li ul li werden die CSS Eigenschaften für die so verschachtelte Liste dahingehend geändert dass die Menüpunkte dieser zweiten Ebene eingerückt und entsprechend schmaler sind und einen geringeren Abstand zueinander sowie zum dazugehörigen Menüpunkt der ersten Ebene aufweisen Es sind natürlich auch andere CSS Formatierungen möglich um diese Struktur zu visualisieren Selbst ohne CSS wird die Struktur von verschachtelten Listen über die Browser Voreinstellungen sehr gut deutlich wie dieses Beispiel zeigt Eine verschachtelte Liste lässt sich auch geteilt darstellen sodass die Menüpunkte der ersten Ebene horizontal in einer Reihe und die der zweiten Ebene vertikal passend darunter angeordnet werden Dazu ist es erforderlich die li Elemente der ersten Ebene per float nebeneinander anzuordnen und ihnen position relative zuzuweisen damit deren Positionen als Bezug für die über position absolute aus dem Elementenfluss genommenen Listenpunkte der zweiten Ebene genutzt werden Beispiel Anzeigebeispiel So sieht s aus DOCTYPE HTML PUBLIC W3C DTD HTML 4 01 EN http www w3 org TR html4 strict dtd html head title Geteilte Navigationsleisten title style type text css body font normal 100 01 Helvetica Arial sans serif color black background color ffffe0 div Rahmen width 47 1em padding 0 8em border 1px solid black background color silver html div Rahmen Korrektur fuer IE 5 x width 48 7em w idth 47 1em div Rahmen div clear left ul Navigation margin 0 padding 0 text align center ul Navigation li list style none float left width 8 6em position relative margin 0 4em padding 0 html ul Navigation li Korrektur fuer den IE 5 und 6 margin bottom 0 4em first child html ul Navigation li Korrektur fuer den IE 7 margin bottom 0 1em ul

    Original URL path: http://html.ekiwi.de/css/layouts/navigationsleisten.htm (2016-04-25)
    Open archived version from archive

  • SELFHTML: Stylesheets / CSS-basierte Layouts / Browserweichen
    alle Version vor 7 less than kleiner als if lte IE 5 5999 alle Version bis 5 5 less than or equal kleiner oder gleich if gte IE 5 5 alle Version ab 5 5 greater than or equal größer oder gleich In der Praxis ist meist nur eine Unterscheidung zwischen Versionen ab 6 und älteren erforderlich da der Internet Explorer ab der Version 6 im standardkonformen Modus einige Fehler der Vorgänger nicht mehr macht und insbesondere das vom W3C spezifizierte Box Modell korrekt anwendet Eine Differenzierung erübrigt sich meist ganz wenn der Internet Explorer 6 in den abwärtskompatiblen Quirks Modus versetzt wird was auch ein beliebiger HTML Kommentar oder bei XHTML die Angabe der XML Deklaration in der ersten Zeile des Quelltextes bewirkt da dieser Browser den folgenden Doctype dann nicht mehr erkennt Der Internet Explorer 7 erkennt zwar eine XML Deklaration wird jedoch weiterhin durch einen HTML Kommentar in den Quirks Modus versetzt Sofern Sie XHTML verwenden und nur die Version 7 des Internet Explorer im standardkonformen Modus eine korrekte Darstellung erreicht bietet sich der Einsatz der ohnehin empfohlenen XML Deklaration an Sie sollten den Internet Explorer grundsätzlich nicht über die Dokumenttyp Weiche in den Quirks Modus versetzen da dies auch andere Browser negativ beeinflusst und z B Opera ab Version 7 das falsche Box Modell von Microsoft übernehmen würde Spezielle Browserweichen CSS Hacks Oft sind es nur kleine Korrekturen die für die einheitliche Umsetzung eines CSS basierten Layouts erforderlich werden und meist reicht es über eine Browserweiche auch Hack genannt den Internet Explorer von anderen Browsern zu unterscheiden da erstgenannter viele CSS Definitionen nicht standardkonform interpretiert Browserweichen nutzen spezielle Selektoren oder Schreibweisen die von Browsern unterschiedlich interpretiert bzw teilweise übergangen werden Das folgende Beispiel demonstriert einige ausgewählte Browserweichen Beispiel Anzeigebeispiel So sieht s aus DOCTYPE HTML PUBLIC W3C DTD HTML 4 01 EN http www w3 org TR html4 strict dtd html head title CSS Browserweichen title style type text css body color white background black font family Helvetica Arial sans serif p padding 0 2em attribut color red p id attribut color lime p id border 1px solid green childselector color red html body childselector color lime starhtml color lime html starhtml color red starplushtml color lime first child html starplushtml color red comment color red comment color lime atmedia color red media all atmedia color lime element color red p element color lime tanhack color lime html tanhack color red c olor lime style style type text css tantek color red tantek voice family voice family inherit color lime style head body h1 CSS Browserweichen h1 p Die folgenden Beispiele werden standardkonform mit grüner Schrift im Rahmen angezeigt ansonsten mit roter Schrift ohne Rahmen p p id attribut Attribut Selektor wird vom Internet Explorer ignoriert und definiert hier alle Rahmen p p id childselector Kind Selektor wird vom Internet Explorer ignoriert p p id starhtml Star HTML wird fälschlich vom Internet Explorer interpretiert p p id starplushtml Star Plus HTML wird fälschlich vom Internet Explorer

    Original URL path: http://html.ekiwi.de/css/layouts/browserweichen.htm (2016-04-25)
    Open archived version from archive

  • SELFHTML: XML / Regeln für XML-Dateien / Baumstruktur und Knoten einer XML-Datei
    Baumstruktur Anstelle von Baumstruktur zu reden könnte man auch den Vergleich zu einer Verzeichnis und Dateistruktur verwenden Konsequenzen für die Datenverarbeitung Die Datenstruktur einer XML Datei lässt sich nicht nur genauso abbilden wie eine Verzeichnis und Dateistruktur sie wird von der verarbeitenden Software auch ganz ähnlich gehandhabt Ein XML Parser arbeitet eine XML Datei ab indem er der Hierarchie folgt die sich durch die Baumstruktur der Daten ergibt Jedes Element jedes Attribut jede Wertzuweisung an ein Attribut jeder Zeicheninhalt eines Elements wird dabei zu einem eigenen Bestandteil des Baums Jeder dieser Bestandteile ist einzeln adressierbar Knoten und Knoten Sets in der Baumstruktur Um über die Bestandteile einer XML Baumstruktur korrekt reden zu können gibt es die beiden Begriffe Knoten und Knoten Set Beide Begriffe beleuchten die Baumstruktur einfach nur aus unterschiedlichen Blickwinkeln Knoten Wenn man von Knoten redet meint man die Bestandteile der Baumstruktur Jedes XML Dokument beginnt mit einem Wurzelknoten Dieser hat jedoch keine konkrete Ausprägung sondern ist nur der abstrakte Ursprung der Daten Erst sein unmittelbarer Abkömmling in der Baumstruktur hat eine konkrete Ausprägung nämlich das Dokument Element also das äußerste den gesamten übrigen Inhalt umfassende Element Im obigen Beispiel ist dies das Element spielfilme Dieser oberste Knoten unterhalb des abstrakten Wurzelknotens hat im Beispiel einen Kindknoten namens film Aus Sicht des Knotens film ist der Knoten spielfilme der Elternknoten Der Knoten film hat drei untergeordnete Knoten nämlich die Attribute regie und titel sowie das Element beschreibung In der XML Praxis werden jedoch Attribute eines Elements anders eingestuft als der Inhalt des Elements Bei Attributknoten spricht man von assoziierten Knoten beim Inhalt dagegen von Kindknoten Diese feine Unterscheidung bleibt in der obigen Abbildung unberücksichtigt Ein Attribut wie regie hat zwar selber noch mal einen eigenen Kindknoten nämlich den Text Tom Tykwer aber der Wert eines Attributes kann in

    Original URL path: http://html.ekiwi.de/xml/regeln/baumstruktur.htm (2016-04-25)
    Open archived version from archive

  • SELFHTML: XML / Regeln für XML-Dateien / Regeln für Tags, Attribute, Wertzuweisungen und Kommentare
    platinentyp platinentyp oder PLATINENTYP PLATINENTYP Auch bei Wertzuweisungen gilt die Unterscheidung zwischen Groß und Kleinschreibung Das ist besonders dann von Bedeutung wenn Sie in einer DTD nur bestimmte Wertzuweisungen für ein Attribut erlauben z B links rechts oder zentriert Anführungszeichen bei Wertzuweisungen Bei XML gilt ohne Ausnahme alle Wertzuweisungen an Attribute müssen in Anführungszeichen stehen bereich sprache deutsch dialekt bayerisch falsch bereich sprache deutsch dialekt bayerisch richtig Innerhalb von Wertzuweisungen an Attribute können Sie auch das Apostroph Zeichen und das Anführungszeichen verwenden Diese beiden Zeichen müssen Sie dann aber unbedingt maskieren nämlich in der Form apos für und quot für Elemente bestehen aus Tags und End Tags In XML gibt es keine alleinstehenden Tags wie in HTML beispielsweise br img oder hr jedes Element muss aus Anfangs und End Tag bestehen Es gibt in XML auch keine optionalen End Tags wie es in HTML etwa bei li oder option der Fall ist Ausnahme Leere Elemente Ausnahmen sind so genannte leere Elemente also Elemente ohne Inhalt Solche Elemente können ohne zugehöriges End Tag notiert werden müssen jedoch als leer gekennzeichnet werden linie falsch linie richtig linie richtig Um ein Element als leer zu kennzeichnen muss am Ende vor der schließenden spitzen Klammer ein Schrägstrich notiert werden Das Leerzeichen davor ist optional aber zu empfehlen Denn linie könnte ein unausgereifter XML Parser auch fälschlich als unerlaubtes Zeichen des Elementnamens linie interpretieren Alternativ zu dieser Notation können Sie leere Elemente auch in der Form linie linie notieren Der Grund ist dass XML eigentlich für jedes Element einen Inhalt vorsieht und dass ein leeres Element einfach ein Element ohne Inhalt ist Wichtig ist dabei jedoch dass Anfangs und End Tag unmittelbar in Folge notiert werden ohne irgendwelche Zeichen dazwischen Elementnamen Elementnamen müssen ein paar Regeln einhalten xml datei falsch datei xml richtig 1a falsch

    Original URL path: http://html.ekiwi.de/xml/regeln/tagsattrwerte.htm (2016-04-25)
    Open archived version from archive

  • SELFHTML: XML / Regeln für XML-Dateien / Wohlgeformtheit, Gültigkeit und Vollständigkeit einer XML-Datei
    Dialog Was jedoch fehlt ist der Bezug zu einer DTD in der die verwendeten Elemente definiert sind Deshalb kann man über das Beispiel sagen es ist wohlgeformt aber nicht gültig Beachten Sie Elemente in wohlgeformten aber nicht gültigen XML Dateien können beliebigen Inhalt haben So ist es problemlos möglich so etwas wie Adam ich betont liebe betont dich Adam zu notieren Wichtig ist nur dass die Elemente korrekt verschachtelt sind d h in der umgekehrten Reihenfolge beendet werden in der sie geöffnet werden und dass die übrigen Regeln für Tags Attribute Wertzuweisungen und Kommentare eingehalten werden Elemente können auch beliebig oft vorkommen Einschränkende Regeln gibt es nur wenn auf eine DTD Bezug genommen wird in der solche Einschränkungen bei der Elementdefinition angegeben sind Gültigkeit eines XML Dokuments vollständiges XML Dokument Ein gültiges XML Dokument enthält zu Beginn eine XML Deklaration und anschließend eine Dokumenttyp Deklaration in der entweder eine externe DTD Datei oder intern die nötigen DTD Regeln angegeben werden Man kann also sagen ein gültiges XML Dokument ist wohlgeformt und außerdem noch validierbar also gegen die in einer DTD definierten Regeln überprüfbar Beispiel einer gültigen und vollständigen XML Datei xml version 1 0 DOCTYPE quelle ELEMENT quelle adresse beschreibung ELEMENT adresse PCDATA ELEMENT beschreibung PCDATA quelle adresse http www willy online de adresse beschreibung alles zum wichtigsten Teil am Manne beschreibung quelle Erläuterung Das Beispiel startet mit der üblichen XML Deklaration Danach folgt eine Dokumenttyp Deklaration mit internen DTD Regeln Genausogut könnte an dieser Stelle auch eine Dokumenttyp Deklaration stehen die auf eine externe DTD verweist Definiert wird im Beispiel ein Dokumenttyp namens quelle mit dem gleichnamigen Dokument Element quelle und zwei davon abhängigen Elementen adresse und beschreibung Zur genauen Syntax von DTD Definitionen siehe Dokumenttyp Definitionen DTDs Im Anschluss an die Dokumenttyp Deklaration folgen die Daten Der Name

    Original URL path: http://html.ekiwi.de/xml/regeln/begriffe.htm (2016-04-25)
    Open archived version from archive



  •