Ladyfaelis: Html übernimmt Css "Einstellungen" aus Body nicht!

Hallo ihr Lieben!
Ichbin noch blutige Anfängerin in diesem gebiet und versuche aus Versuch und irrtum zu lernen.
Nun ja, ich habe jetzt ein Problem, dass ich selbst durch Recherche im Inet nicht lösen kann..

Ich habe eine css datei für den Style meiner späteren Webseite erstellt..
Baue ich die Datei in eine Html Datei ein, werden alle Werte soweit übernommen, nur nicht die des Bodys..
Da ich schon recht verwirrd bin und vllt nur etwas übersehe, bitte ich euch einmal drüber zu schauen, vllt findet ihr den Fehler.

Der Body wird sowohl im Ie als auch im Ff nicht angezeigt, deshalb denke ich, es ist ein Fehler im Bodybereich..

Das ist der css Teil des Body-Bereichs:

<html>  
<head>  
<title>Style</title>  
<style type="text/css">  
 body {  
    color: black; background-color: lightgrey;  
    background-image: url(Sonne.jpg);background-attachment:fixed;  
    font-size: 100.01%;  
    font-family: Comic sans Ms, Verdana;  
    margin: 0; padding: 1em;  
    #border: 2px solid black;  
  }

und dies habe ich in die Html Datei eingebaut, damit das css übernommen wird:

<?xml version="1.0" ?>  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"  
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
  
<html>  
<head>  
<link rel=stylesheet type="text/css" href="Style.css">  
<!--  
  
-->  
</style>  
</head>  

Es werden wohl einige Fehler drin sein .. Wie gesagt, ich fanhe erst an, also bitte habt Nachsicht ;)

Vieen Dank im Voraus für eure (hoffentlich) zahlreichen Antworten!
Ladyfaelis

  1. Hallo ihr Lieben!
    Ichbin noch blutige Anfängerin in diesem gebiet und versuche aus Versuch und irrtum zu lernen.
    Nun ja, ich habe jetzt ein Problem, dass ich selbst durch Recherche im Inet nicht lösen kann..

    Ich habe eine css datei für den Style meiner späteren Webseite erstellt..
    Baue ich die Datei in eine Html Datei ein, werden alle Werte soweit übernommen, nur nicht die des Bodys..
    Da ich schon recht verwirrd bin und vllt nur etwas übersehe, bitte ich euch einmal drüber zu schauen, vllt findet ihr den Fehler.

    Der Body wird sowohl im Ie als auch im Ff nicht angezeigt, deshalb denke ich, es ist ein Fehler im Bodybereich..

    Das ist der css Teil des Body-Bereichs:

    <html>

    <head>
    <title>Style</title>
    <style type="text/css">
    body {
        color: black; background-color: lightgrey;
        background-image: url(Sonne.jpg);background-attachment:fixed;
        font-size: 100.01%;
        font-family: Comic sans Ms, Verdana;
        margin: 0; padding: 1em;
        #border: 2px solid black;
      }

    
    >   
    >   
    > und dies habe ich in die Html Datei eingebaut, damit das css übernommen wird:  
    >   
    > ~~~sprache
    
    <?xml version="1.0" ?>  
    
    > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"  
    > "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
    >   
    > <html>  
    > <head>  
    > <link rel=stylesheet type="text/css" href="Style.css">  
    > <!--  
    >   
    > -->  
    > </style>  
    > </head>  
    > 
    
    

    Es werden wohl einige Fehler drin sein .. Wie gesagt, ich fanhe erst an, also bitte habt Nachsicht ;)

    Vieen Dank im Voraus für eure (hoffentlich) zahlreichen Antworten!
    Ladyfaelis

    Hallo Miriam,

    hast du beim Html-Teil, den du hier gepostet hast etwas (im Headbereich) ausgelassen?

    Sollte das nicht eigentlich so aussehen:

    <?xml version="1.0"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//DE" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
    <head>
    <link rel=stylesheet type="text/css" href="Style.css">
    </head>
    <body> etc....

    nächste Frage: Sicher, dass Strict richtig ist? Hat mir auch schonmal designs zerhauen. Die richtige deklaration ist wichtig!

    Gruß, Stefan

    1. Hallo Stefan, danke für deine schnelle Antwort!
      Ich habe das jetzt ausprobiert, leider funzt das trotzdem nicht.

      Anstatt "Strict" was könnte ich dort hinschreiben?
      ich habe jetzt noch "Transitional" probiert, geht leider auch nicht!
      Was ich an der ganzen Sache am wenigsten verstehe ist, wenn ich die "Style.css" datei in "Style.htm" ändere und sie mir im Browser ansehe, dann wird alles richtig angezeigt.

      Jedoch werden, wie bereits oben beschrieben, die Werte nicht übernommen, wenn ich die css Datei in eine Html Datei einbinde.
      Alles, wird richtig angezeigt, nur eben der Body nicht.

      1. Hallo Stefan, danke für deine schnelle Antwort!
        Ich habe das jetzt ausprobiert, leider funzt das trotzdem nicht.

        Anstatt "Strict" was könnte ich dort hinschreiben?
        ich habe jetzt noch "Transitional" probiert, geht leider auch nicht!

        Erstmal ist ja die Frage ob überhaupt xhtml!?

        Versuchs halt mal mit:

        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
        <HTML>
        <HEAD>

        1. Hallo Stefan, danke für deine schnelle Antwort!
          Ich habe das jetzt ausprobiert, leider funzt das trotzdem nicht.

          Anstatt "Strict" was könnte ich dort hinschreiben?
          ich habe jetzt noch "Transitional" probiert, geht leider auch nicht!

          Erstmal ist ja die Frage ob überhaupt xhtml!?

          Versuchs halt mal mit:

          <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
          <HTML>
          <HEAD>

          :) Jetzt übernimmt er gar keine css Befehle mehr ;)
          Könnte das wirklich an dem liegen?
          Ich meine, alles andere übernimmt er doch, selbst wenn ich xhtml nehme...
          Demensprechend gehe ich davon aus, dass es gar nich So falsch sein kann..
          Eben ahlt nur der Body Bereich.

          1. Ich bin auch kein Experte.

            Weiß nur, dass mir die falsche Dekleration schon das ein oder andere Design zerhauen hat. (Die einzelnen Deklerationen haben auch Ihre eigenen .ddt's, darauf hast du aber geachtet, oder?)

            Ich müsste halt mal einen Blick auf die gesamten Dateien werfen - sowohl die gesamte css, als auch die htm(l).

            1. Ich bin auch kein Experte.

              Weiß nur, dass mir die falsche Dekleration schon das ein oder andere Design zerhauen hat. (Die einzelnen Deklerationen haben auch Ihre eigenen .ddt's, darauf hast du aber geachtet, oder?)

              Ich müsste halt mal einen Blick auf die gesamten Dateien werfen - sowohl die gesamte css, als auch die htm(l).

              ich habs einfach rauskopiert ;)

              Die Css datei ist diese:

                
              <html>  
              <head>  
              <title>Style</title>  
              <style type="text/css">  
                
                
                body {  
                  color: black; background-color: lightgrey;  
                  background-image: url(Sonne.jpg);background-attachment:fixed;  
                  font-size: 100.01%;  
                  font-family: Comic sans Ms, Verdana;  
                  margin: 0; padding: 1em;  
                  #border: 2px solid black;  
                }  
                
                h1 {  
                  font-size: 1.5em;  
                  margin: 0 0 0.7em; padding: 0.3em;  
                  text-align: center;  
                  background-color: #a7caf0;  
                  border: 2px ridge silver;  
                }  
                
                ul#Navigation {  
                  font-size: 0.83em;  
                  float: left; width: 18em;  
                  margin: 0 0 1.2em; padding: 0;  
                  border: 1px dashed silver;  
                  position: fixed;  
                }  
                ul#Navigation li {  
                  list-style: none;  
                  margin: 0; padding: 0.5em;  
                }  
                ul#Navigation a {  
                  display: block;  
                  padding: 0.2em;  
                  font-weight: bold;  
                }  
                ul#Navigation a:link {  
                  color: black; background-color: #a7caf0;  
                }  
                ul#Navigation a:visited {  
                  color: #666; background-color: #a7caf0;  
                }  
                ul#Navigation a:hover {  
                  color: black; background-color: white;  
                }  
                ul#Navigation a:active {  
                  color: white; background-color: gray;  
                }  
                
                div#Info {  
                  background-image: url(palme.jpg);background-attachment:fixed;  
                  font-size: 0.9em;  
                  float: right; width: 12em;  
                  margin: 0 0 1.1em; padding: 0;  
                  background-color: #eee; border: 1px dashed silver;  
                
                }  
                div#Info h2 {  
                  font-weight:bold;;  
                  margin: 0.2em 0.5em;  
                  text-align:center;  
                }  
                div#Info p {  
                  font-size: 1em;  
                  margin: 0.5em;  
                }  
                
                div#Inhalt {  
                  width:400px;  
                  margin: 0 12em 1em 16em;  
                  #min-height:500Px;  
                  padding:3px;  
                  border: 1px dashed black;  
                  background-image: url(Seestern.jpg);background-attachment:fixed;  
                  font-weight:bold;  
                  text-align:center;  
                  position:absolute;  
                
                }  
                * html div#Inhalt {  
                  height: 1em;  /* Workaround gegen den 3-Pixel-Bug des Internet Explorer bis Version 6 */  
                  background: transparent;  
                }  
                div#Inhalt h2 {  
                  font-size: 1.2em;  
                  margin: 0.2em 0;  
                  background: transparent;  
                  text-align:center;  
                  font-weight:bold;  
                  font-color:brown;  
                  text-decoration:underline;  
                }  
                div#Inhalt p {  
                  font-size: 1em;  
                  background: transparent;  
                  height:100%;  
                }  
                
                div#leer {  
                clear:both;  
                }  
                
                div#bild img {  
                width:32%;  
                float:left;  
                border: 1px solid black;  
                margin-left:2px;  
                margin-bottom:20px;  
                text-align:center;  
                
                }  
                
                
                div#Fusszeile {  
                  clear: both;  
                  font-size: 0.9em;  
                  margin: 0; padding: 0.1em;  
                  text-align: center;  
                  background-color: #a7caf0; border: 1px solid silver;  
                
                }  
                
                
              </style>  
              </head>
              

              Und die Html Datei hab ich noch gar nicht richtig bearbeitet, weil eben der Body nicht richtig angezeigt wird..
              Da hab ich eben das, was ich vorhin schon mal gepostet hab..

              1. Bevor ich mir das genau angucke...

                Das ist keine CSS-Datei..

                CSS DATEI(!!!), also eine, die du via link extern abrufst lautet:

                body {
                    color: black; background-color: lightgrey;
                    background-image: url(Sonne.jpg);background-attachment:fixed;
                    font-size: 100.01%;
                    font-family: Comic sans Ms, Verdana;
                    margin: 0; padding: 1em;
                    #border: 2px solid black;
                  }

                h1 {
                    font-size: 1.5em;
                    margin: 0 0 0.7em; padding: 0.3em;
                    text-align: center;
                    background-color: #a7caf0;
                    border: 2px ridge silver;
                  }

                ul#Navigation {
                    font-size: 0.83em;
                    float: left; width: 18em;
                    margin: 0 0 1.2em; padding: 0;
                    border: 1px dashed silver;
                    position: fixed;
                  }
                  ul#Navigation li {
                    list-style: none;
                    margin: 0; padding: 0.5em;
                  }
                  ul#Navigation a {
                    display: block;
                    padding: 0.2em;
                    font-weight: bold;
                  }
                  ul#Navigation a:link {
                    color: black; background-color: #a7caf0;
                  }
                  ul#Navigation a:visited {
                    color: #666; background-color: #a7caf0;
                  }
                  ul#Navigation a:hover {
                    color: black; background-color: white;
                  }
                  ul#Navigation a:active {
                    color: white; background-color: gray;
                  }

                div#Info {
                    background-image: url(palme.jpg);background-attachment:fixed;
                    font-size: 0.9em;
                    float: right; width: 12em;
                    margin: 0 0 1.1em; padding: 0;
                    background-color: #eee; border: 1px dashed silver;

                }
                  div#Info h2 {
                    font-weight:bold;;
                    margin: 0.2em 0.5em;
                    text-align:center;
                  }
                  div#Info p {
                    font-size: 1em;
                    margin: 0.5em;
                  }

                div#Inhalt {
                    width:400px;
                    margin: 0 12em 1em 16em;
                    #min-height:500Px;
                    padding:3px;
                    border: 1px dashed black;
                    background-image: url(Seestern.jpg);background-attachment:fixed;
                    font-weight:bold;
                    text-align:center;
                    position:absolute;

                }
                  * html div#Inhalt {
                    height: 1em;  /* Workaround gegen den 3-Pixel-Bug des Internet Explorer bis Version 6 */
                    background: transparent;
                  }
                  div#Inhalt h2 {
                    font-size: 1.2em;
                    margin: 0.2em 0;
                    background: transparent;
                    text-align:center;
                    font-weight:bold;
                    font-color:brown;
                    text-decoration:underline;
                  }
                  div#Inhalt p {
                    font-size: 1em;
                    background: transparent;
                    height:100%;
                  }

                div#leer {
                  clear:both;
                  }

                div#bild img {
                  width:32%;
                  float:left;
                  border: 1px solid black;
                  margin-left:2px;
                  margin-bottom:20px;
                  text-align:center;

                }

                div#Fusszeile {
                    clear: both;
                    font-size: 0.9em;
                    margin: 0; padding: 0.1em;
                    text-align: center;
                    background-color: #a7caf0; border: 1px solid silver;

                }

                So wie, du es hast, hast du eine html-datei, bzw, den anfang davon, mit integrierten style-angaben im head-bereich

                1. Ah.. Oki. also muss ich quasi das
                  "<html>
                  <head>
                  <title>Style</title>
                  <style type="text/css">"

                  oben weg machen?

                  Soll ich dir was sagen: du bist klasse :D
                  Es funzt ..
                  Vielen, vielen Dank..
                  Darauf wär ich nie selbst gekommen..

                  1. Soll ich dir was sagen: du bist klasse :D
                    Es funzt ..
                    Vielen, vielen Dank..
                    Darauf wär ich nie selbst gekommen..

                    Bitte..

                    Auch wenn es jetzt funktioniert aber nochmal (damit du es verstehst;)):

                    Wenn du die Styledefinitionen in ein externes Stysheet auslagerst, gehören dort NUR die CSS-Referenzen hinein. Du musstest also nicht "nur"

                    "<html>
                    <head>
                    <title>Style</title>
                    <style type="text/css">"

                    oben weg machen?

                    sondern auch unten die abschließenden

                    »»</style>
                    »»</head>

                    In der HTML bindest du

                    (UND ZWAR OHNE <!-- --> </style> - was auch immer du damit ausdrücken wolltest!?) das Stylesheet, also die CSS-Datei, mit dem Befehl:

                    <link rel=stylesheet type="text/css" href="Style.css"> ein.

                    Beste Grüße, Stefan

                    PS: Miriam war richtig, oder? ;P

                    1. Bitte..

                      Auch wenn es jetzt funktioniert aber nochmal (damit du es verstehst;)):

                      Wenn du die Styledefinitionen in ein externes Stysheet auslagerst, gehören dort NUR die CSS-Referenzen hinein. Du musstest also nicht "nur"

                      "<html>
                      <head>
                      <title>Style</title>
                      <style type="text/css">"

                      oben weg machen?

                      sondern auch unten die abschließenden

                      »»</style>
                      »»</head>

                      In der HTML bindest du

                      (UND ZWAR OHNE <!-- --> </style> - was auch immer du damit ausdrücken wolltest!?) das Stylesheet, also die CSS-Datei, mit dem Befehl:

                      <link rel=stylesheet type="text/css" href="Style.css"> ein.

                      Beste Grüße, Stefan

                      PS: Miriam war richtig, oder? ;P

                      Ist jetzt alles korrigiert.. Diese Pfeile .. Hmm.. Ich weiss auch nicht mehr genau, woher ich die hatte, für den Anfang habe ich aus frei zur Verfügung stehenden Layouts die Dinge rauskopiert, die ich brauchte.Und das wird wohl irgendwo dabei gewesen sein ;)

                      Und ja; miriam war richtig ;)

                      1. Na sehr schön!

                        Dann schick doch mal ne mailto:stephanxschmitz@web.de, wenn die Seite online ist.

                        Bis denn! Stefan

                      2. Hallo

                        Ist jetzt alles korrigiert.. Diese Pfeile .. Hmm.. Ich weiss auch nicht mehr genau, woher ich die hatte, für den Anfang habe ich aus frei zur Verfügung stehenden Layouts die Dinge rauskopiert, die ich brauchte.Und das wird wohl irgendwo dabei gewesen sein ;)

                        Du weißt offensichtlich noch nicht, womit du es zu tun hast, nämlich einem Kommentar im HTML-Quelltext. Das (intensive) Stöbern in SELFHTML: Allgemeine Regeln für HTML (für diesen Fall besonders: Grundgerüst einer HTML-Datei, Kommentare und Credits und die von Martin erwähnten Konventionen für Dateinamen) sollte dir ein Grundverständnis vom Umgang mit HTML vermitteln.

                        Wofür die einzelnen Elemente verwendet werden und welche Dinge dabei zu beachten sind, kannst du dann in den einzelnen Abschnitten von SELFHTML-(X)HTML (zu denen auch die oben genannten gehören) nachlesen.

                        Tschö, Auge

                        --
                        Die deutschen Interessen werden am Liechtenstein verteidigt.
                        Veranstaltungsdatenbank Vdb 0.2
                  2. Hallo,

                    Ah.. Oki. also muss ich quasi das
                    "<html>
                    <head>
                    <title>Style</title>
                    <style type="text/css">"
                    oben weg machen?

                    ... und den entsprechenden Rest unten auch, ja.

                    Soll ich dir was sagen: du bist klasse :D
                    Es funzt ..
                    Vielen, vielen Dank..
                    Darauf wär ich nie selbst gekommen..

                    Aber genau dasselbe habe ich dir eine halbe Stunde früher auch schon geraten. Lesen musst du schon selbst. ;-)

                    So long,
                     Martin

                    --
                    "Hier steht, deutsche Wissenschaftler hätten es im Experiment geschafft, die Lichtgeschwindigkeit auf wenige Zentimeter pro Sekunde zu verringern." - "Toll. Steht da auch, wie sie es gemacht haben?" - "Sie haben den Lichtstrahl durch eine Behörde geleitet."
  2. Hallo,

    Ich habe eine css datei für den Style meiner späteren Webseite erstellt..
    Baue ich die Datei in eine Html Datei ein, werden alle Werte soweit übernommen, nur nicht die des Bodys..

    was *genau* steht in der externen CSS-Ressource? Deine Beschreibung hört sich so an, als hättest du auch noch HTML-Tags am Anfang mit drin. Das wäre falsch - die CSS-Datei darf *nur* den reinen CSS-Code enthalten!

    body {
        color: black; background-color: lightgrey;
        background-image: url(Sonne.jpg);background-attachment:fixed;
        font-size: 100.01%;
        font-family: Comic sans Ms, Verdana;
        margin: 0; padding: 1em;
        #border: 2px solid black;
      }

    Das Rauten-Symbol vor dem border - ist das Absicht? Was meinst du damit?

    <link rel=stylesheet type="text/css" href="Style.css">
    <!--

    -->
    </style>

    Diese Zusammenstellung ist unsinnig. Nach dem link-Element haben weder der HTML-Kommentar, noch ein schließendes </style>-Tag etwas verloren. Weg damit.

    Es werden wohl einige Fehler drin sein .. Wie gesagt, ich fanhe erst an, also bitte habt Nachsicht ;)

    Kein Problem, wir haben alle mal klein angefangen.

    Und noch ein allgemeiner Rat: Ich sehe bei dir teils gemischte Groß- und Kleinschreibung in den Dateinamen. Gewöhne dir am besten an, Datei- und Verzeichnisnamen durchgehend klein zu schreiben. Das ist eine übliche Konvention. Denke daran, dass die meisten Server auf Unix-artigen Betriebssystemen laufen - und die unterscheiden bei Dateinamen peinlich genau zwischen Groß- und Kleinschreibung. "Sonne.jpg" und "sonne.jpg" sind daher zwei unterschiedliche Dinge!

    So long,
     Martin

    --
    Zwei Stammtischbrüder:
    Hier steht, dass laut Statistik über 60 Prozent aller Ehefrauen fremdgehen.
    Was soll ich mit dieser Information? Ich brauche Namen, Fotos, Telefonnummern ... !