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

CSS-Datei in HTML einbinden funktioniert nicht!

Waldwolf

Neues Mitglied
Ich arbeite seit 2-3 Monaten am programieren einer Website (http://anika.khgagg.de) Heute hab ich angefangen mich mit Stylesheets zu beschäftigen, aber so recht klappt das nicht. Ich wollte gern mit dem Befehl <link rel="stylesheet" type="text/css" href="link.css"> eine CSS-Datei einbinden um die Farbe der Links auf allen Seiten gleichzeitig ändern zu können. Ich hab es mit verschiedenen Befehlen versucht und auch den Beispielquelltext einer Website ausprobier und die Seite mit verschiedenen Browsern (Firefox und Explorer) geöffnet. Nichts hilft! Mein Program weigert sich den Befehl auszuführen! :(

Hat jemand eine Ahnung woran das liegen könnte?

Liebe Grüße Waldwolf
 
Zuletzt bearbeitet:
Werbung:
Ich muss raten aber ich schätze deine CSS Datei heißt nicht link.css oder die Datei ist nicht im Stammverzeichniss.

och finde den link zur CSS Datei bei den ganzen Frames nicht!
 
Danke für die schnelle Antwort PeterPan,

im Internet steht noch die alte Version, da ist die Datei noch nicht dabei. Ich bin mir aber sicher das ich sie link.css genannt hab, das hab ich mehrmals kontroliert.
Gespeichert ist sie unter Stylesheets. Ich kopier dir mal den quelltext rein. Ich hoffe das hilft dir/ihnen was (darf man sich hier dutzen?)

Quelltext der CSS-Datei:

a:link { blue }
v:link { darkblue }

--------------------------------------------------------------

Quelltext der HTML-Datei

<HTML>
<HEAD>
<TITLE>Hompage der Umweltmentorin und ihres Verbündeten</TITLE>
<link rel="stylesheet" type=css" href="/Stylesheets/link.css">
</HEAD>

<BODY background="Bilder/Hintergrundbild_Blatt2.gif" >
<table width="90%" border="0" align="center">
<tr>
<td><img src="Bilder/friedenstaube.gif" width=150 height=150 border=0 align="right">
</td>

...

</BODY></HTML>
 
Werbung:
Der CSS Quelltext kann nicht funktionieren.

Willst du zum Beispiel die Hintergrundfarbe ändern machst du das so:

Code:
hierkommtdertaghin {
background-color : #000000;
}
[code]
#000000 ist der Hex Code für schwarz.

Was ist v für ein Tag?
 
was meinst du mit "tag"? Wofür steht das?

In meinem Buch stand v:link für einen Link, einer noch nicht besuchten Seite und a:visited für eine bereits besuchte Seite
 
Das ist auch fast richtig. Mit Tag meine ich z.B <p> oder <td>. Ersetzte das v:link durch a:link und mache die Hintergrundfarbe so:

Code:
a:link {
background-color : #0000ff;
}
[code]
 
Werbung:
Stimmt der Quelltext jetzt so?

a:link {
background-color : #0000ff;
}
a:visited {
background-color : #000080
}

--> es funktioniert immer noch nicht!

Und warum background-color? Ich will doch die Schriftfarbe und nicht den Hintergrund ändern.
 
Ich wollte gern mit dem Befehl <link rel="stylesheet" type="text/css" href="link.css">...
Das nennt sich "Tag", nicht "Befehl". "Befehl" kommt aus einer Programmiersprache. HTML ist keine Programmiersprache, sondern viel, viel weniger. Nur eine Strukturbeschreibungssprache.

In Deinem Code steht das Style-Tag im Title-Tag:
Code:
<TITLE> <style type=text/css">
<!-- a:link {text-decoration:none} --></style></TITLE>
Das geht natürlich nicht so.
Ein externes Stylesheet ist nicht eingebunden.
Außerdem hast Du erhebliche Defizite in Sachen HTML, das mit Frames zu machen war ein riesiger Fehler und die HTML-Auszeichnung (Semantik!) ist größtenteils falsch.

Mit CSS brauchst Du erst anfangen, wenn Du HTML beherrschst, sonst macht CSS keinen Spaß, weil es einfach auf eine valide und semantisch sinnvolle Basis aus HTML angewiesen ist!

a:link {
background-color : #0000ff;
}
Und warum background-color? Ich will doch die Schriftfarbe und nicht den Hintergrund ändern.
Es sollte für Dich ein leichtes sein, eine Suchmaschine Deiner Wahl mit den richtigen Stichworten zu füttern, um entweder herauszufinden, wie die Eigenschaft in CSS für die Schriftfarbe heißt, oder um eine Übersicht aller CSS-Eigenschaften zu finden. Man muss ja nicht immer alles einfach ohne nachzudenken abschreiben, insbesondere wenn man selber merkt, dass es nicht das ist, was man will...
 
Werbung:
Hi Publisher,

Warum soll die Einbindung der Stylesheets leichter gehen wenn man keine frames bentutz? Wie wirken die sich aus?

------------------------------------------

Hi Elfchen,

danke für deine Antwort.

In Deinem Code steht das Style-Tag im Title-Tag:
Code:
<TITLE> <style type=text/css">
<!-- a:link {text-decoration:none} --></style></TITLE>
Das geht natürlich nicht so.

Du schreibst das mein Style -Tag im Title-Tag stehen würde. Kannst du mir bitte zeigen wo? Ich hab grad noch mal nach geschaut. So weit ich mich auskenne ist der Titel-Tag davor geschlossen.

Quelltext: <HTML>
<HEAD>
<TITLE>Hompage der Umweltmentorin und ihres Verbündeten</TITLE>
<link rel="stylesheet" type=css" href="/Stylesheets/link.css">
</HEAD>
...

</BODY></HTML>

Ein externes Stylesheet ist nicht eingebunden.

Wenn nicht mit diesem Tag: <link rel="stylesheet" type=css" href="/Stylesheets/link.css">, mit welchen soll ich das Stylesheet dann einbinden?

Du sagst auch das ich keine Frames nehmen soll. Kannst du mir dann einen Tip geben wie ich die Seite sonst aufteilen kann?

Das ich so viele Fehler im Quelltext habe tut mir leid. Wie gesagt, ich habe erst vorkurzen angefangen und mein Vater stößt solangsam an seine Grenzen. Daher weißt mich niemanden so Sachen hin. Könntest du mir vielleicht sagen wo ich ganz große Schnitzer rein gebaut hab?

Es sollte für Dich ein leichtes sein, eine Suchmaschine Deiner Wahl mit den richtigen Stichworten zu füttern, um entweder herauszufinden, wie die Eigenschaft in CSS für die Schriftfarbe heißt, oder um eine Übersicht aller CSS-Eigenschaften zu finden. Man muss ja nicht immer alles einfach ohne nachzudenken abschreiben, insbesondere wenn man selber merkt, dass es nicht das ist, was man will...

Ich hab nachdem es mit dem Tag nicht geklappt hat ein zweites Buch zu rate gezogen und auch verschiedene Seiten bemüht. Es hat aber, wie du siehst nichts gebracht, sonst hätte ich mich nicht angemeldet. Die CSS-Eigenschaft für Farbe heißt soweit ich weiß a:link { color: blue } oder hab ich da einen Fehler?
 
Zuletzt bearbeitet:
Du schreibst das mein Style -Tag im Title-Tag stehen würde. Kannst du mir bitte zeigen wo?
<style type=text/css"> </style>

Die Stelle, wo Du einen <link> zum Stylesheet drin hast, hab dagegen ich noch nicht gefunden :-)

Wenn nicht mit diesem Tag: <link rel="stylesheet" type=css" href="/Stylesheets/link.css">, mit welchen soll ich das Stylesheet dann einbinden?
Das hab ich nicht gesagt, ich habe nur gesagt, dass ich das im Code nirgendwo gefunden habe. Weder im Frameset, noch in den drei Unterseiten, die da geladen werden, ist dieses Tag drin.

Du sagst auch das ich keine Frames nehmen soll. Kannst du mir dann einen Tip geben wie ich die Seite sonst aufteilen kann?
Mit CSS. Aber lerne vorher richtiges HTML, denn CSS funktioniert nur anständig, wenn auch Dein HTML anständig ist. Und das kann nur anständig sein, wenn anständiger Inhalt da ist, das heißt, Du musst mit Deinem Inhalt anfangen.

[quite]Das ich so viele Fehler im Quelltext habe tut mir leid.[/quote]
Das ist für mich ehrlich gesagt nicht wichtig, und Du musst Dich deswegen auch nicht schlecht fühlen :-)
Es ist halt Fakt, dass Fehler drin sind, und es ist auch Fakt, dass Du sie beseitigen musst, wenn Du ein anständiges Ergebnis erzielen willst. Der Grund für die Fehler ist offensichtlich, Du hast gerade erst mit der Materie angefangen - aber das ist weder ein Grund, aufzugeben, meine ersten Seiten sahen genauso aus, wenn nicht schlechter :-) und es ist auch kein Grund, sich auszuruhen. Ab an die Arbeit ;-)

Wie gesagt, ich habe erst vorkurzen angefangen und mein Vater stößt solangsam an seine Grenzen. Daher weißt mich niemanden so Sachen hin. Könntest du mir vielleicht sagen wo ich ganz große Schnitzer rein gebaut hab?
Fast überall. Layout mit Tabellen, Inhalt und Layout miteinander vermischt, Tags zur physischen Inhaltsauszeichnung, schlechte Semantik.

Um HTML-Seiten auf die Syntax zu testen, kannst Du den The W3C Markup Validation Service benutzen. Semantik aber - und das ist der eigentliche Sinn von HTML - kann kein Programm testen.

Schau mal hier zum Thema HTML (Semantik):
Einführung | Webdesign mit XHTML und CSS

Die CSS-Eigenschaft für Farbe heißt soweit ich weiß "color"
Das ist richtig! :-)
 
Hi Publisher,

Warum soll die Einbindung der Stylesheets leichter gehen wenn man keine frames bentutz? Wie wirken die sich aus?

Mit Frames sollst du keine Websites erstellen, mehr gibts eigentlich nicht dazu zu sagen. Probleme mit Suchmaschinen, evt bei einigen Browser falsche Darstellung etc.. Mit 3 Frames brauchst du 3 verschiedene .css stylesheets.

Und <link rel="stylesheet" type=css" href="/Stylesheets/link.css">
ist sowieso Falsch wegen type. 1 Gänsefüsschen fehlt, ob es auch ohne text/ geht, keine Ahnung. Aber auch egal denn:

so muss das sein

<link rel="stylesheet" type="text/css" href="deinedatei.css media="screen" />
 
Werbung:
Warum soll die Einbindung der Stylesheets leichter gehen wenn man keine frames bentutz?
Das hab ich vorhin überlesen. So formuliert, ist die Aussage falsch, denn das Einbinden von Stylesheets geht immer gleich leicht und Stylesheets und Frames schließen sich nicht aus.

Frames haben grundsätzlich andere Probleme, das hat aber nichts mit CSS zu tun.
 
Hallo Elfchen und Publisher,

vielen Dank noch mal euch beiden das ihr so schnell und ausführlich geantwortet habt.
Momentan hab ich mir den riesen Wälzer meines Vaters geschnappt und bin am lesen. In dem Buch was ich davor hatte waren Stylesheets nur am Rande erwähnt-vielleicht war es doch schon etwas alt (1997) ...
Ich darf also mehr oder weniger noch mal von vorne anfangen. *schnief* dabei dachte ich, ich hätte zumindest die Grundlagen kapiert. Dem war wohl nicht so.

Trotzdem hab ich noch ein paar Fragen:


  1. wenn man mit html kein Layout fest legen soll, warum gibt es dann Befehle dafür?
  2. was bedeutet Syntax, Sematik und physische Inhaltsausrichtung? Und warum muss man die so genau von einander trennen?
  3. warum gibt es frames wenn man sie dann doch nicht benutzen soll?
  4. was ist momentan die aktuellste version von html?
Wäre schön wenn ihr noch mal die Gedult hättet mir das zu erklären.

Ansonsten dürfte sich das Thema dann mehr oder weniger erledigt haben. Denn bevor ich da irgendwas einbinde ist es glaube ich sinnvoller mich noch mal mit den Grundlagen zu beschäftigen und dazu eine neue Anfrage zu starten, Korriegiert mich falls ich da falsch liege.

Liebe Grüße Waldwolf
 
In dem Buch was ich davor hatte waren Stylesheets nur am Rande erwähnt-vielleicht war es doch schon etwas alt (1997)
Hätte man mich gefragt, wann CSS eingeführt wurde, hätte ich "1998" geschätzt. Zum Zeitpunkt der Drucklegung dieses Buches kann CSS also nur in den Kinderschuhen gesteckt haben. Demnach ist aber auch stark anzunehmen, dass das Buch HTML ebenso falsch erklärt.

Ich darf also mehr oder weniger noch mal von vorne anfangen. *schnief* dabei dachte ich, ich hätte zumindest die Grundlagen kapiert. Dem war wohl nicht so.
Das denken sogar heute noch viele Agenturen, die basteln supertolle Designs zusammen, der HTML-Code entspricht aber viel zu oft nicht den Anforderungen von HTML - oft auch deswegen, weil viele Webmaster noch nicht kapiert haben, dass es im WWW nicht nur ums Aussehen geht.
Du bist also in bester Gesellschaft ;-)

wenn man mit html kein Layout fest legen soll, warum gibt es dann Befehle dafür?
Es gibt keine Befehle in HTML, die gibts nur in Programmiersprachen. HTML ist aber eine Strukturbeschreibungssprache.
Damals, als Du noch jünger warst :-) gab es kein CSS. Da hat man HTML so verbogen, dass man mit HTML Layout machen kann. Diese Tags benutzt man aber nicht mehr, es gibt ja keinen Grund dafür seit es CSS gibt. Das war damals sozusagen nur ein Hack - denn HTML war nie dafür konzipiert, das Aussehen einer Seite zu bestimmen, sondern immer nur die Semantik.

was bedeutet Syntax, Sematik und physische Inhaltsausrichtung? Und warum muss man die so genau von einander trennen?
Die Syntax einer Sprache ist, wie sie aufzubauen ist. Dass bei HTML z.B. Tags immer mit < beginnen und mit > abgeschlossen werden. Dass es nur bestimmte Tags gibt, dass es je nach Tag verschiedene Attribute gibt usw.
Semantik heißt soviel wie die Bedeutung des Inhalts. Das legst Du mit HTML fest. Das heißt, Du sagst, welcher Text bei Dir eine Überschrift sein soll, was als Textabsatz gilt, wo eine Adresse ist oder Du legst wichtige Textpassagen fest. Für alle diese Bedeutungen gibt es ein bestimmtes Tag, das diese Bedeutung hat. <strong> z.B. bedeutet "sehr wichtig". <b> hat keine semantische Bedeutung (das ist einfach so festgelegt), das ist ein Tag für physische Inhaltsauszeichnung, was so viel heißt wie "Darstellung". Und dafür ist HTML ja nicht gedacht (Hack, s.o.).
Trennen sollst Du das, weil alles insgesamt dann einfacher wird.
Ganz einfaches Beispiel dazu: Du willst, dass auf allen Deinen Seiten jeder Textabsatz in der Schriftart "Courier" geschrieben ist.
Du kannst das nun bei jedem <p>-Tag im style-Attribut angeben:
Code:
<p style="font-family:Courier">Text</p>
das wäre schon auf einer einzigen Seite eine ziemliche Arbeit.
Du kannst es aber auch in den Header der Seite schreiben
Code:
<head>
...
<style type="text/css">
p {
  font-family:Courier;
}
</style>
</head>
Das musst Du dan nur einmal machen. Wenn Du das aber auf allen Deinen 100 Seiten so haben willst, brauchst Du das nur einmal in ein externes Stylesheet zu schreiben und das auf allen Seiten einbinden.
Außerdem ist eine Änderung von Layout/Design mit externen Stylesheets einfacher. Schau Dir mal css Zen Garden: The Beauty in CSS Design an, das sind hunderte verschiedener Designs, und ALLE basieren auf dem selben HTML-Code. Nur das Stylesheet ist anders. Demzufolge ist ein Redesign auch viel einfacher, wenn man alles ordentlich trennt.

warum gibt es frames wenn man sie dann doch nicht benutzen soll?
Weil es damals keine adere Möglichkeit gab, seine Seite einzuteilen. Anstatt Dinge sofort anständig zu entwickeln, hat man damals eben viele Hacks gebaut, die schnell verfügbar sein mussten (die Browser-Hersteller haben sich damals bekriegt um Marktanteile) und "cool" sein mussten.
Die Nachteile von Frames haben wir glaub ich schon verlinkt.

was ist momentan die aktuellste version von html?
"aktuellst"? Was ist denn aktueller als aktuell?
Die aktuelle Version von HTML ist 4.01, die von XHTML ist 1.1. HTML 5 und XHTML 2.0 sind aber bereits in Entwicklung, Teile davon kann man in neuen Browsern auch schon nutzen.

Wäre schön wenn ihr noch mal die Gedult hättet mir das zu erklären.
Wenn es Dir was hilft und Du das nicht vergisst, dann gerne :-)

Denn bevor ich da irgendwas einbinde ist es glaube ich sinnvoller mich noch mal mit den Grundlagen zu beschäftigen und dazu eine neue Anfrage zu starten, Korriegiert mich falls ich da falsch liege.
Da gibt es keinen Grund zur Korrektur.

Viel Erfolg.

Und wenn Fragen sind, dann fragen!
 
Werbung:
Hallo Elfchen,

ich hab es noch mal mit Stylesheets probiert. Aber es funktioniert (wie zu erwarten) wieder nicht. Könntest du dir mal bitte den Quelltext anschauen und probieren den Fehler zu finden. Bitte lass dich nicht durch den Rest irritieren. Ich weiß das der eine Kathastrophe ist.

<HTML>
<HEAD>
<TITLE>Hompage der Umweltmentorin und ihres Verbündeten</TITLE>
<body style="background-image:url (Bilder/Hintergrundbild_Blatt2.gif)"><table width="90%" border="0" align="center">
<tr>
<td><img src="Bilder/friedenstaube.gif" width=150 height=150 border=0 align="right">
</td>
</tr>
<tr>
<td colspan="2"> <CENTER><P><H1><B>Herzlich willkommen!</B></H1>
<BR>
<H3>Schön, dass du den Weg hierher gefunden hast.
<BR><BR>
Willst du etwas über Umweltschutz oder die Umweltmentoren wissen?
<BR><BR>
Hast du Lust mit anzupacken?
...
</H3></P></CENTER>
</td>
</tr>
</table>
<BR><BR><BR>
...


</BODY></HTML>
 
Aber es funktioniert (wie zu erwarten) wieder nicht. Könntest du dir mal bitte den Quelltext anschauen und probieren den Fehler zu finden.
Dazu wäre es gut, wenn du sagen würdest, was genau nicht funktioniert, denn so können wir nur raten.

Bitte lass dich nicht durch den Rest irritieren. Ich weiß das der eine Kathastrophe ist.
Dann änder das doch erstmal. Es macht keinen Sinn sich mit CSS zu beschäftigen, wenn das HMTL nicht vernünftig ist.
Den Link hat dir Efchen ja schon gegeben.

Für den nächsten Quellcode den du einfügst, benutze bitte die entsprechenden Tags, damit der Code formatiert und dadurch besser lesbar wird. [*html]...[*/html], [*code]...[*/code], [*php]...[*/php] jeweils ohne *
 
<HTML>
<HEAD>
<TITLE>Hompage der Umweltmentorin und ihres Verbündeten</TITLE>
<body style="background-image:url (Bilder/Hintergrundbild_Blatt2.gif)"><table width="90%" border="0" align="center">
<tr>
<td><img src="Bilder/friedenstaube.gif" width=150 height=150 border=0 align="right">
</td>
</tr>
<tr>
<td colspan="2"> <CENTER><P><H1><B>Herzlich willkommen!</B></H1>
<BR>
<H3>Schön, dass du den Weg hierher gefunden hast.
<BR><BR>
Willst du etwas über Umweltschutz oder die Umweltmentoren wissen?
<BR><BR>
Hast du Lust mit anzupacken?
...
</H3></P></CENTER>
</td>
</tr>
</table>
<BR><BR><BR>
...


</BODY></HTML>

Abschluss von head fehlt </head>

Erst nach dem Head Abschluss kommt dann <body>

Im <body> ist ein inline CSS, lösch das mal raus.
HTML:
<HEAD>
<TITLE>Hompage der Umweltmentorin und ihres Verbündeten</TITLE>
<style type="text/css">
<!--
body {background-image:url(deineurl.jpg);
}
-->
</style>
</HEAD>
<body>
.....

Aber eben lern mal zuerst die Grundlagen von HTML und CSS. Denn nicht mal dein Grundgerüst war korrekt.

Das ist nun ein Beispiel mit internem CSS. Wenn du mehrere Seiten gleichformatierst, solltest du Externes CSS verwenden.
 
Werbung:
Danke für die Tipps, es zeigt jetzt das Hintergrundbild richtig an. :smile:

Das fehlende </head> muss ich ganz am Ende gelöscht haben. ursprünglich war es einmal drinn.

Aber eben lern mal zuerst die Grundlagen von HTML und CSS. Denn nicht mal dein Grundgerüst war korrekt

Ich bin gerade dabei mir HTML und CSS beizubringen. Nur geht das eben nicht von heut auf morgen. Das ändern des Tags für den Hintergrund war eben ein erster Versuch CSS einzubinden, anstatt dafür HTML zu nutzen.

Was war denn außer dem Fehlenden </head> an meinem Grundgerüst noch falsch? Ich kann es nur korriegieren wenn es mir auch jemand sagt.

Das ist nun ein Beispiel mit internem CSS. Wenn du mehrere Seiten gleichformatierst, solltest du Externes CSS verwenden.

Als ich probiert hab ein Externes CSS zu verwenden wurde mir gesagt ich solle erst mal die veralteten HTML-Tags rausnehmen. Das hab ich grad versucht. Dafür brauch ich aber ein internes CSS.

Waldwolf
 
Zuletzt bearbeitet:
Zurück
Oben