App installieren
How to install the app on iOS
Follow along with the video below to see how to install our site as a web app on your home screen.
Anmerkung: This feature may not be available in some browsers.
Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden.
Du solltest ein Upgrade durchführen oder einen alternativen Browser verwenden.
Du solltest ein Upgrade durchführen oder einen alternativen Browser verwenden.
Validation von erzeugtem HTML
- Ersteller Gast
- Erstellt am
Das war der Knackpunkt.
So sah die Anzeige schon ganz anders aus. Ich konnte dann mit kleinen strukturellen Abänderungen in der XSL- und in der CSS-Datei die erwünschte Baumstruktur erzeugen.
Das müsste dann auch als erzeugtes HTML valide sein.
XSL:
CSS:
So sah die Anzeige schon ganz anders aus. Ich konnte dann mit kleinen strukturellen Abänderungen in der XSL- und in der CSS-Datei die erwünschte Baumstruktur erzeugen.
Das müsste dann auch als erzeugtes HTML valide sein.
XSL:
Code:
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns="http://www.w3.org/1999/xhtml">
<xsl:output method="xml" version="1.0" encoding="UTF-8" indent="yes"
doctype-system ="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN"/>
<xsl:template match="/">
<html>
<head>
<link rel="stylesheet" type="text/css" href="mindmap.css"/>
<title>Mindmaps</title>
</head>
<body>
<!-- Links zu den Maps -->
<p>
<img src="Bilder/freemind.ico" alt="Original1"/>
<a href="FreeMindMaps/mindmap1.mm">Original1</a>*
<a href="mindmap1.xml">Resultat1</a>**
<img src="Bilder/freemind.ico" alt="Original2"/>
<a href="FreeMindMaps/mindmap2.mm">Original2</a>*
<a href="mindmap2.xml">Resultat2</a>**
<img src="Bilder/freemind.ico" alt="Original3"/>
<a href="FreeMindMaps/mindmap3.mm">Original3</a>*
<a href="mindmap3.xml">Resultat3</a>
</p>
<!-- fuer jedes Element rekursive Methode aufrufen, count fuer die Ebenentiefe -->
<xsl:for-each select="node">
<ul>
<xsl:call-template name="rek">
<xsl:with-param name="count" select="0"/>
</xsl:call-template>
</ul>
</xsl:for-each>
</body>
</html>
</xsl:template>
<xsl:template name="rek">
<xsl:param name="count"/>
<li>
<!-- Abfrage der jeweiligen Ebene, Ausgabe der Elemente wird
den entsprechenden Klassen zugeordnet -->
<xsl:choose>
<xsl:when test="$count = 0">
<p class= "root">
<!--> Ausgabe der Knoten, Verlinkungen werden extra behandelt -->
<xsl:choose>
<xsl:when test="icon/@BUILTIN = 'forward'">
<xsl:element name="a">
<xsl:attribute name="href">
<xsl:value-of select="@TEXT" />
</xsl:attribute>
<xsl:value-of select="@TEXT"/>
</xsl:element>
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="@TEXT"/>
<xsl:apply-templates select="icon/@BUILTIN"/>
</xsl:otherwise>
</xsl:choose>
</p>
</xsl:when>
<xsl:when test="$count = 1">
<p class= "ebene1">
<xsl:choose>
<xsl:when test="icon/@BUILTIN = 'forward'">
<xsl:element name="a">
<xsl:attribute name="href">
<xsl:value-of select="@TEXT" />
</xsl:attribute>
<xsl:value-of select="@TEXT"/>
</xsl:element>
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="@TEXT"/>
<xsl:apply-templates select="icon/@BUILTIN"/>
</xsl:otherwise>
</xsl:choose>
</p>
</xsl:when>
<xsl:when test = "$count = 5">
<p class= "ebene4">
<xsl:choose>
<xsl:when test="icon/@BUILTIN = 'forward'">
<xsl:element name="a">
<xsl:attribute name="href">
<xsl:value-of select="@TEXT" />
</xsl:attribute>
<xsl:value-of select="@TEXT"/>
</xsl:element>
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="@TEXT"/>
<xsl:apply-templates select="icon/@BUILTIN"/>
</xsl:otherwise>
</xsl:choose>
</p>
</xsl:when>
<xsl:when test = "$count = 2">
<p class= "ebene2">
<xsl:choose>
<xsl:when test="icon/@BUILTIN = 'forward'">
<xsl:element name="a">
<xsl:attribute name="href">
<xsl:value-of select="@TEXT" />
</xsl:attribute>
<xsl:value-of select="@TEXT"/>
</xsl:element>
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="@TEXT"/>
<xsl:apply-templates select="icon/@BUILTIN"/>
</xsl:otherwise>
</xsl:choose>
</p>
</xsl:when>
<xsl:when test = "$count = 3">
<p class= "ebene3">
<xsl:choose>
<xsl:when test="icon/@BUILTIN = 'forward'">
<xsl:element name="a">
<xsl:attribute name="href">
<xsl:value-of select="@TEXT" />
</xsl:attribute>
<xsl:value-of select="@TEXT"/>
</xsl:element>
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="@TEXT"/>
<xsl:apply-templates select="icon/@BUILTIN"/>
</xsl:otherwise>
</xsl:choose>
</p>
</xsl:when>
<xsl:otherwise>
<p class= "ebene4">
<xsl:choose>
<xsl:when test="icon/@BUILTIN = 'forward'">
<xsl:element name="a">
<xsl:attribute name="href">
<xsl:value-of select="@TEXT" />
</xsl:attribute>
<xsl:value-of select="@TEXT" />
</xsl:element>
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="@TEXT"/>
<xsl:apply-templates select="icon/@BUILTIN"/>
</xsl:otherwise>
</xsl:choose>
</p>
</xsl:otherwise>
</xsl:choose>
<!-- jeder Unterknoten ruft wieder die Methode auf, Ebene wird erhoeht -->
<xsl:for-each select="node">
<ul>
<xsl:call-template name="rek">
<xsl:with-param name="count" select="$count+1"/>
</xsl:call-template>
</ul>
</xsl:for-each>
</li>
</xsl:template>
</xsl:stylesheet>
Code:
ul {list-style-type: none}
p {margin: 0px}
/* Aufzaehlungszeichen und Abstand zwischen Elementen entfernen */
li ul:last-child {background-image: url(Bilder/linie1.gif); background-position: up-left; background-repeat: no-repeat}
ul:not(:last-child) {background-image: url(Bilder/linie2.gif); background-position: up-left; background-repeat: no-repeat}
/* Pseudoklassen um die Linienbilder passend auszurichten */
.ebene1 {color: green; font-weight: bold}
.ebene2 {color: green}
.ebene3 {color: red}
.ebene4 {color: orange}
.leaf {font-style: normal}
.root {padding: 5px; color: red; background-color: yellow; font-size: large; display: inline-block}
/* Ebenen- (letzte = leaf) und Wurzelklasse */
ul li p:not(:last-child) {border-style: solid; border-width: thin; display: inline-block; border-color: black}
/* Pseudoklasse innernode fuer die Rahmen */