• 19.04.2024, 15:15
  • Registrieren
  • Anmelden
  • Sie sind nicht angemeldet.

 

CSS in HTML einbinden

Freitag, 5. März 2004, 17:00

Hi

Ich bastel hier gerade an ner Website... nu würd ich da gern ne CSS Datei für die Formatirungen verwenden... nu hab ich dazu aber einige fragen:

1. Reicht es wenn ich die CSS im Index einbinde oder muss ich in jede einzelnen Frame setzen?

2. Wie sieht der Grundaufbau einer CSS aus?

3. Wie genau bind ich die CSS ein?


Ha da diverse Props mit wo mir selbst self HTML ned wirklic weiter helfen kann...

Man In Blue
A sinking ship is still a ship!

Re: CSS in HTML einbinden

Freitag, 5. März 2004, 17:23

Dieser Link sollte eigentlich alle deine Fragen beantworten.

http://selfhtml.teamone.de/css/

Re: CSS in HTML einbinden

Freitag, 5. März 2004, 17:25

Ich machs so :

in header kommt :
<link rel="stylesheet" type="text/css" href="main.css">

also haste ne eigene datei (in meinem fall main.css) die einfach eingebunden wird - ist VIEL besser als es direkt in die page zu schreiben - so kannste nämlich mit einer datei ALLE Pages ändern wo dus eingebunden hast ;)

mfG TrOuble

Re: CSS in HTML einbinden

Freitag, 5. März 2004, 17:26

Augen auf machen bitte.

Hab doch bereits geschrieben das ich mit dem self HTML KRams ned wirklich weiter komme...

Man In Blue

EDIT:

TrOuble:

Jo... will ich ja auch... funtzt aber ned...
A sinking ship is still a ship!

Re: CSS in HTML einbinden

Freitag, 5. März 2004, 17:39

Poste mal das was in der *.html und in der *.css Datei steht.

Re: CSS in HTML einbinden

Freitag, 5. März 2004, 17:46

zunächst mal empfielt es sich stark(!!!), das stylesheet separat abzulegen als .css-datei und dann von jeder seite aus einzubinden. dies hat den vorteil, dass die style-informationen (im gegensatz zu den meisten angepassten foren) nur einmal übertragen werden müssen. daraus resultiert a) auf dauer bedeutend weniger datentransfer/kürzere gesamtladezeit und b) eine schnelleres rendering durch den browser, da er schon auf das im cache befindliche stylesheet zugreifen kann, bevor die seite komplett geladen ist.

1. ein stylesheet gilt für die seite, in der es wirklich eingebunden wurde, sprich im html auftaucht, das im browser ankommt. wenn du seiten in frames oder iframes unterbringst, sind darin ja selbstständige html-seiten, die ebenfalls das stylesheet referenzieren müssen.

2. die css-datei hat keine speziellen header und muss auch nicht in das style-tag eingeschlossen sein. in der datei stehen nur C-kommentare ( /* ... */ ), die sich über mehrere zeilen erstrecken können, und die einzelnen style-klassen (klasse { ... eigenschaften ... } ). dabei sind zu unterscheiden:
- allgemeine klassen: h1 { .. }
- spezielle klassen: h1.meineklasse { ... } - wird eingebunden im html-tag mittels class="meineklasse"
- einmalige(!!!) ids: h1#footer { ... } - wird eingebunden im html-tag mittels id="footer" (darf nur einmalig in der seite vergeben werden!)

außerdem gibts die möglichkeit von verschachtelungen, die in einigen fällen sehr empfehlenswert sind und "code" sparen können.

3. hat trouble bereits beantwortet.

Re: CSS in HTML einbinden

Freitag, 5. März 2004, 17:51

Zitat von »churchi«

Poste mal das was in der *.html und in der *.css Datei steht.


Quellcode

1
2
3
4
5
6
7
8
9
10
<html>
      <head>
            <title>Name</title>
            <link rel="stylesheet" type="all" href="style.css">
      </head>

      <body>
      oben.htm
      </body>
</html>

oben.htm


Quellcode

1
2
3
4
5
body {
 font-family: Arial;
 font-size: large;
 text-align: justify;
}

style.css

Man In Blue
A sinking ship is still a ship!

Re: CSS in HTML einbinden

Freitag, 5. März 2004, 18:01

das mit dem body im style.css funktioniert nicht

es muss so aussehen:

Quellcode

1
2
3
4
5
6
7
8
9
10
11
<html> 
 <head> 
  <title>Name</title> 
  <link rel="stylesheet" type="all" href="style.css"> 
 </head> 
 
 <body> 
 oben.htm 
<h1>oben.htm</h1>
 </body> 
</html>

oben.htm


Quellcode

1
2
3
4
5
6
h1
{
 font-family: Arial; 
 font-size: large; 
 text-align: justify; 
}

style.css

anstatt h1 kann man auch anderes verwenden.
z.B.: p, h2 ... h6, a ...

Re: CSS in HTML einbinden

Freitag, 5. März 2004, 18:07

selfhtml schreibt aber unter 'pseudoformate definieren'

Quellcode

1
2
3
4
5
6
7
8
9
10
11
12
13
<html>
<head>
<title>Titel der Datei</title>
<style type="text/css">
<!--
 a:link { color:#EE0000; text-decoration:none; font-weight:bold; }
 a:visited { color:#EEAAAA; text-decoration:none; font-weight:bold; }
 a:hover { color:#EE0000; text-decoration:none; background-color:#FFFF99; font-weight:bold; }
 a:active { color:#0000EE; background-color:#FFFF99; font-weight:bold; }
 body { font-family:Arial,sans-serif; font-size:12pt; }
-->
</style>
</head>


habe nämlich ebenfalls ein problem mit css
irgendwie wird das body nicht interpretiert.
visit:

Re: CSS in HTML einbinden

Freitag, 5. März 2004, 18:10

Also die main.css date von einer meiner pages (www.generationx-lan.de.vu)
sieht so aus :

Quellcode

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
BODY {
background: #999999;
}

a:link{
      color : #000000;
      text-decoration : none;
}

a:visited{
      color : #000000;
      text-decoration : none;
}

a:hover{

      text-decoration : none;
}

a:active{

      text-decoration : none;

}

a.SB_inlink:link {
      color : #000000;
      text-decoration : none;
}

a.SB_inlink:visited {

      text-decoration : none;
}

a.SB_inlink:active {

      text-decoration : none;
}

a.SB_inlink:hover {

      text-decoration : none;

Re: CSS in HTML einbinden

Freitag, 5. März 2004, 18:18

@churchi:
blödsinn, natürlich funktioniert das im body.
der fehler ist das type="all".
korrekt wäre: type="text/css" media="all"

edit:
es gibt da nen schönen validator vom w3c: http://jigsaw.w3.org/css-validator/validator-uri.html

und ich bin so frei darauf zu verzichten, hier meine stylesheets mit 400+ zeilen zu pasten...

Re: CSS in HTML einbinden

Freitag, 5. März 2004, 18:21

Ah. Funtzt...

THX!
A sinking ship is still a ship!

Re: CSS in HTML einbinden

Freitag, 5. März 2004, 18:25

Zitat von »Y0Gi«

@churchi:
blödsinn, natürlich funktioniert das im body.
der fehler ist das type="all".
korrekt wäre: type="text/css" media="all"


ist mir gerade aufgefallen - war nur zu langsam :'(