HTML: Eingebundene CSS-Datei funktioniert nicht?
Hallo Leute,
ich habe seit heute mit dem Erstellen von Webseiten angefangen. Ich habe mir schon sehr viel dazu angeschaut und bin auch der Meinung, dass ich das meiste schon weiß.
Ich habe also eine HTML-Datei erstellt und wie es auch sein muss in den
<head>...</head>
einen Link zur entsprechenden CSS-Datei eingeführt. Der Link ist auch zu 100% korrekt, sowohl vom Aufbau als auch von der Rechtschreibung (insbesondere der Dateipfad).
Das HTML-Dokument lässt sich auch ganz normal im Internet abrufen, jedoch wird die CSS-Datei nicht ausgeführt (da die Farbe sich nicht verändert).
Es muss also etwas mit dem Link nicht stimmen, da die CSS-Datei auch keine Fehler enthält. Ich habe auch verschiedene Browser probiert.
Fakt ist: Ich habe schon alles probiert, tausendmal über alles drüber geschaut und auch im Internet nach ähnlichen Fehlern gesucht. Jedoch hat alles nicht geholfen.
Hier mein Code:
HTML:
<!DOCTYPE HTML>
<html>
<head>
<link href= "style.css" rel= "stylesheet" type= "css/txt" >
<title>Regenwasser</title>
</head>
<body>
<p><h1>Regenwasser</h1></p>
<ul>
<li>s</li>
<li>l</li>
<li>o</li>
<li>l </li>
<li>p-</li>
<li>u</li>
<li>P</li>
<li>Fi</li>
<li>Wass</li>
<li>AQUA</li>
<li>PLURAF</li>
<li>AQ</li>
</ul>
</body>
</html>
CSS:
p {
color: red;
}
ul li {
color: green;
height: 500px
}
Ich bin daran echt am Verzweifeln und sitze schon locker über zwei Stunden daran.
6 Antworten
Vielleicht hast Du ein "Space" zu viel, oder aber Deine styles.css ist falsch.
space spielt soweit ich weiß in der programmierung grundsätzlich kaum eine rolle mit ausnahme in ".."
versuch mal statt
<link href= "style.css" rel= "stylesheet" type= "css/txt" >
<link href="style.css" rel="stylesheet" type="text/css" >
Des Weiteren hast du hier noch einen Fehler:
<p><h1>Regenwasser</h1></p>
Der schließende p-Tag am Ende der Zeile hat keine öffnenden Partner. Der Starttag am Anfang ist es nicht, denn der schließt sich automatisch, sobald er auf ein Blockelement trifft (das wäre das h1-Element). Wenn du zusätzliche Abstände vor / nach dem h1-Element haben möchtest, verwende CSS (margin). Die beiden p-Tags hingegen sollten raus.
Ich sehe hier mehrere Fehler
1. Die h1 liegt innerhalb einer p
Das macht so keinen Sinn
https://www.w3schools.com/html/default.asp
2. Die Definition des CSS Files
es schreibt sich type=''text/css''
da du keine unterordner verlinkt hast vermute ich dass die style.css datei im root/httpdocs verzeichnis liegt. richtig?
Dein Type Tag im Link Tag ist falsch.
type="text/css"
Und mach die Leerzeichen raus
krass.. dachte das hätte ich auch schon überprüft.. aber du hast recht jetzt geht es hahha. hätte ich mal direkt gefragt. dankeschön!