• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Quellcode übernimmt CSS Befehl nicht

speedy1007

Neues Mitglied
Hallo liebes HTML-Forum,
ich habe folgendes Problem.
Er übernimmt meine CSS Befehle für meinen Quellcode nicht.
Der Quellcode sieht wie folgt aus:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
<title>Aufgaben Liste</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/CSS">
h1{
font-family: "Comic Sans MS", sans-serif;
text-decoration: blink;
}
ol li {list-style-type: upper roman;]
#griechisches Alphabetol li {list-style-type: lower greek;}
ul li {list-style-type: lower alpha;}
ul li ol li {list-style-type: lower-alpha;}
ul li ol li ol li {list-tyle-type: upper-alpha;}
ul li ol li ul li {list-style-image: url{smiley.gif);}
</style>
</head>
<body>
<h1>Aufgaben Liste</h1>

<ol>
<li>Alpha</li>
<li>Beta</li>
<li>Gamma</li>
</ol>

<div id="griechisches Alphabet">
<ol>
<li>Alpha</li>
<li>Beta</li>
<li>Gamma</li>
</ol>
</div>

<ul>
<li>Mathe</li>
<li>Deutsch</li>
<li>IV</li>
<ol>
<li>Office</li>
<li>Web-Design</li>
<ul>
<li>XHTML</li>
<li>CSS</li>
<li>PHP</li>
</ul>
</li>
<li>Datenbanken</li>
<ol>
<li>ERM</li>
<li>Normalisierung</li>
<li>SQL</li>
</ol>
</li>
<li>E-Commerce</li
</ol>
</li>
<li>Religion</li>
</ul>





</body>
</html>

Die Frage ist nun: Warum übernimmt er die CSS Befehle nicht?
Was habe ich falsch gemacht?
Ich würde mich über schnelle Antowrten sehr freuen, da ich die Antwort schnell benötige.

MfG
Christo
 
Zuletzt bearbeitet:
Ok,

Ohne Gewähr , dass ich jetz alle Fehler gefunden habe....
Also:

Mache dir nochmal die allgemeine Schreibweise für Selektoren bewusst:
Selektor { Eigenschaft: Wert; }
h1 > kein Leerzeichen
1. ol li Anweisung: keine geschweifte Klammer.
grieschisches Alphabet Selektor: Selektoren dürfen kein Leerzeichen enthalten!!! Nur A-Z, 0-9 Unter und Bindestrich.
Die letzen drei Stylessheet - Auszeichnungen ergeben keinen Sinn.
bedeutet:
li ist enthalten in ol
die letzte Ebene ist also das Listenelement selbst.!!!

Ich empfehle dir , den Code nochmal neu zu schreiben. Denn du hast die Grundsynthax von CSS leider noch nicht ganz verstanden. Was dazu führst dass du nur "machst" ohne zu wissen "wie". Auf www.css4you.de kannst du dich nochmal über Selektoren & CO, informieren. Dort findest du auch ein Basis-Workshop in dem die Grundlagen in ein paar Seiten beschrieben sind. Was du versuchst also mehreren Listen / Listenelementen verschiedene Eigenschaften zu geben kannst du ganz einfach mit einem ID Selektor lösen / die Kombination von einem ID- und Klassenselektor.
Beispiel:

Code:
<ul id="liste1">
<li class="eintrage1">...</li>
<li class="eintraege1">...</li>
</ul>
Stylesheet:

Code:
#liste1 {
/* Eigenschaften für die Liste selbst */
}
.eintraege1 {
/* Eigenschaften fuer die Eintrage die zur Klasse Eintraege1 gehoeren */
Wenn du den einzelnen Listenelementen also den einzelnen <li> Elementen eine ID gibst oder eine Klasse zuteilst kannst du ihnen weitere Eigenschaften geben.
 
Zuletzt bearbeitet:
P.S:

CSS hat eine ganz einfache Regel wenn es um die Anwendung einer Regel geht. Nämlich: Der letzte kommt zuerst.
Schreibst du also :
Code:
ul li { color: red; }
ul li { color: blue; }
bedeutet das nicht das die Farbe rot für die Elemente der ersten Liste angewandt werden,
und die Farbe blau für die der zweiten. Sondern: dass die Farbe blau für alle Listenelemnte angewandt wird.

Willst du z.B. eine Eigenschaft auf Selektoren anwenden musst du Sie durch Komma trennen.

Beispiel:
Code:
em, strong {
color: red;
}
 
Zuletzt bearbeitet:
Ich habe es jetzt nochmal mit deinen Tipps versucht, aber bei der verschachtelten Liste bin ich am Ende.
Dort weiß ich nicht, wie ich es machen soll.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
<title>Aufgaben Liste</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/CSS">
h1 {
font-family: "Comic Sans MS", sans-serif;
text-decoration: blink;
}

#upper-roman li {
list-style-type: upper-roman;
}

#lower-greek li {
list-style-type: lower-greek;
}

#square {
list-style-type: square;
}

#lower-alpha li {
list-style-type: lower-alpha;
}

ol li {
list-style-type: lower-alpha;
}




</style>
</head>
<body>
<h1>Aufgaben Liste</h1>

<div id="upper-roman">
<ol>
<li>Alpha</li>
<li>Beta</li>
<li>Gamma</li>
</ol>
</div>

<div id="lower-greek">
<ol>
<li>Alpha</li>
<li>Beta</li>
<li>Gamma</li>
</ol>
</div>


<ul id="square>
<li>Mathe</li>
<li>Deutsch</li>
<li>IV</li>

<ol>
<li>Office</li>
<li>Web-Design</li>
<ul>
<li>XHTML</li>
<li>CSS</li>
<li>PHP</li>
</ul>
</div>
</li>
<li>Datenbanken</li>
<ol>
<li>ERM</li>
<li>Normalisierung</li>
<li>SQL</li>
</ol>
</li>
<li>E-Commerce</li>
</ol>
</li>
<li>Religion</li>
</ul>
</body>
</html>
 
mach mal aus dem <ul id="square> ein <ul id="square"> und schau mal ob du auch alle Listen richtig eingeleitet und auch mit dem selben Tag zugemacht hast!!!

Listen schachtelst du so
Code:
<ul>
<li>
      <ol>
              <li>
              </li>
      </ol>
</li>
</ul>
um auf die ol zuzugreifen brachst du einen anderen Selektor.

Code:
ul>li+ol>li  {
/* Eigenschaften */
}
Aber warum mach ich hier eigentlich deine Hausaufgaben?
 
Zuletzt bearbeitet:
Ich verstehe nicht, wie ich die Listen schließen soll mit </li> und sowas bei verschachtelten Listen.
Könntest du mir da helfen?
Speziell bei dieser Passage: (wenn man jetzt mal die CSS Geschichte außen vor lääst)

<ul>
<li>Mathe</li>
<li>Deutsch</li>
<li>IV</li>

<ol>
<li>Office</li>
<li>Web-Design</li>
<ul>
<li>XHTML</li>
<li>CSS</li>
<li>PHP</li>
</ul>
</div>
</li>
<li>Datenbanken</li>
<ol>
<li>ERM</li>
<li>Normalisierung</li>
<li>SQL</li>
</ol>
</li>
<li>E-Commerce</li>
</ol>
</li>
<li>Religion</li>
</ul>
 
Viele Dank erstmal vorab für deine Hilfe :)
Du machst nicht meine Hausaufgaben. Das sind eigene Aufgaben von mir, mit der ich mich für eine Klausur vorbereite.
Daher vielen vielen Dank :)
Versuch das jetzt noch mit dem CSS hinzubekommen, dann wird das schon :p
 
Könnte mir jemand erklären, welche Fehler nun noch bestehen?
Fehler (6)

Zeile Spalte: 1
67 Fehler: Das Element ol ist hier nicht erlaubt. Überprüfen Sie ob dieses Element im umgebenden Element erlaubt ist.
Ergänze evtl. fehlendes li - Element
Fehlerstelle:

<ol id="lower-alpha">




Zeile Spalte: 1
71 Fehler: Das Element ul ist hier nicht erlaubt. Überprüfen Sie ob dieses Element im umgebenden Element erlaubt ist.
Ergänze evtl. fehlendes li - Element
Fehlerstelle:

<ul id="lower-roman">




Zeile Spalte: 1
80 Fehler: Das Element ol ist hier nicht erlaubt. Überprüfen Sie ob dieses Element im umgebenden Element erlaubt ist.
Ergänze evtl. fehlendes li - Element
Fehlerstelle:

<ol id="upper-alpha">




Zeile Spalte: 1
90 Fehler: li ist an dieser Stelle nicht erlaubt.

Es befindet sich evtl. ein Block-Element innerhalb eines
Inline-Elements.

Auch verschachtelte Block-Elemente könnten diesen Fehler verursachen, da
Block-Elemente nicht beliebig verschachtelt werden dürfen. Dies ist abhängig
von den verwendeten [X]HTML-Elementen.
Fehlerstelle:

<li>Religion</li>




Zeile Spalte: 5
91 Fehler: Schließendes LI-Element wurde nicht gefunden, obwohl dies zwingend notwendig ist.
Fehlerstelle:

</ul>




Zeile Spalte: 1
67 Fehler: Starttag war hier
Fehlerstelle:

<ol id="lower-alpha">


Wäre nett,wenn mir jemand sagen kann, was ich noch ändern muss, damit es valide ist.


MfG
Christo
 
Vielleicht liegt's ja daran, dass du
Code:
ol li {list-style-type: upper roman;]
schreibst, es aber
Code:
ol li {list-style-type: upper roman;}
heißen muss…
 
Zurück
Oben