Tutorial HTML, CSS u. PHP - Forum

von **Nic4** » Montag 6. September 2010, 18:03

Hallo habe erst vor kurzen html abgeschlossen und bin nun bei Css uns ich habe eine frage .
Die ersten twei varianten verstehe ich nicht aber die dritte nicht .
http://www.html-seminar.de/stylesheets_ ... binden.htm.

Mit den auslagern einer Datei .
Soll man ein css datei unter design.css speichern oder soll ich ein ordne anlegen der so heißt .
und in der html datei soll ich dann<link href="design.css" type="text/css" rel="stylesheet" />
eingeben oder? Und soll ich diese datei in den ordner abspeichern?

Und habe noch ein problem wenn ich bei mir (webocon Scriptly) folgendes eingebe:
<style type="text/css">

</style>
funktonierts nicht und wird rot angezeigt aber wen ich es kopier von html seminar wird es richtig angezeigt.
Und in welchen bereich soll ich des eingeben?
Das soll man doch in einer Css datei eingeben.

Könntet ihr mir es ausführlich erklären.

Danke im vorraus Nic

von **Sarkkan** » Montag 6. September 2010, 18:16

Hey Nic4 (=

Also, man erstellt als erstes eine CSS-Datei (*.css) und verlinkt dann zu dieser, quasi wie bei einem ganz normalen Link, z.B. wenn die Datei im selben Ordner liegt

Code: Alles auswählen: <link href="design.css" type="text/css" rel="stylesheet" />

Oft wirst du auch sehen, dass diese Dateien in einem Extra Ordner wie 'Design'; 'Style'; ... zu finden ist, dann sieht der Link so aus:

Code: Alles auswählen: <link href="style/design.css" type="text/css" rel="stylesheet" />

(Das nur gerade zur Auffrischung^^)

Du musst auch auf Groß- und Kleinschreibung achten!
Umlaute in Datei, oder Ordnernamen sind nicht empfehlenswert,.. Das übliche halt ;)

In die CSS-Datei kommt übrigens nur der Teil zwischen dem <style>-Tag! (ohne die )
Also z.B. nur

Code: Alles auswählen: h1 { color:#FF9F00; font-size:28pt; font-family:arial, }

Dadurch, dass es sich um eine Style-Datei handelt, weiß der Browser, was er damit zu machen hat (=

von **Sören** » Montag 6. September 2010, 18:29

Nic4 hat geschrieben:Mit den auslagern einer Datei .
Soll man ein css datei unter design.css speichern oder soll ich ein ordne anlegen der so heißt .
und in der html datei soll ich dann<link href="design.css" type="text/css" rel="stylesheet" />
eingeben oder? Und soll ich diese datei in den ordner abspeichern?

Also den ausgelagerten Quellcode speicherst du in einer *.css Datei (z.B. design.css). Diese Datei kannst du dann einbinden, in dem du in den head Teil deiner HTML-Datei das reinpackst, was du schon gesagt hast. Mit dem richtigen Pfad natürlich.
Beispiel:

Code: Alles auswählen: [...] <head> <title>...</title> <link href="design.css" type="text/css" rel="stylesheet" /> </head>

Ein Beispiel, wenn die CSS-Datei im Ordner css liegt:

Code: Alles auswählen: <link href="css/design.css" type="text/css" rel="stylesheet" />

Nic4 hat geschrieben:Und habe noch ein problem wenn ich bei mir (webocon Scriptly) folgendes eingebe:
<style type="text/css">

</style>
funktonierts nicht und wird rot angezeigt aber wen ich es kopier von html seminar wird es richtig angezeigt.

Ich weiß gerade nicht genau, was du meinst.

Nic4 hat geschrieben:Und in welchen bereich soll ich des eingeben?
Das soll man doch in einer Css datei eingeben.

Das wird auch auf der Seite anhand von Beispielen gezeigt.
Wenn du es nicht auslagerst packst du es im <style></style> Tag in den head der HTML-Seite rein.
Du schreibst also, statt dem <link/>, wo du den Pfad angibst, die Datei vollständig in deine HTML-Seite in <style>.
Beispiel ausgelagert (s. ganz oben):

Code: Alles auswählen: [...] <head> <title>...</title> <link href="design.css" type="text/css" rel="stylesheet" /> </head>

Nicht ausgelagert:

Code: Alles auswählen: <head> <title>...</title> <style type="text/css"> ... </style> </head>

Du musst allerdings aufpassen, dass du in der ausgelagerten Datei das <style> am Anfang und Ende (</style>) weglässt.

Tja Sarkkan war zwar eher fertig, schicks aber trotzdem ab.

von **sejuma** » Montag 6. September 2010, 18:59

Ob du für die CSS-Datei einen eigenen Ordner anlegst, ist Geschmacksache. Ich hab es mir so angewöhnt.
Wichtig ist, dass der Pfad dorthin stimmt.
HIer ebenfalls noch einige Infos: http://www.ohne-css.gehts-gar.net/0053.php

von **Sören** » Montag 6. September 2010, 19:03

sejuma hat geschrieben:HIer ebenfalls noch einige Infos: http://www.ohne-css.gehts-gar.net/0053.php

@Nic: Beachte drittens gar nicht, bevor du dir noch was schlechtes angewöhnst.

von **Nic4** » Freitag 10. September 2010, 13:54

Danke für die antworten :mrgreen:

Tutorial HTML, CSS u. PHP - Forum

CSS im html einbinden

CSS im html einbinden

Re: CSS im html einbinden

Re: CSS im html einbinden

Re: CSS im html einbinden

Re: CSS im html einbinden

Re: CSS im html einbinden

Wer ist online?