zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden Frage zum Buch Little boxes

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 23.10.2008, 19:23
Benutzerbild von Magellan
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.02.2007
Ort: Zurzeit noch Meerane in Sachsen
Beiträge: 97
Magellan befindet sich auf einem aufstrebenden Ast
Standard Frage zum Buch Little boxes

Zu meiner Frage
Warum ist in der Datei fundament.css diese Anweisung

body {
background-color: white;
color: black;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: small;
}

Und in der dazu gehörigen Datei bildschirm.css diese Anweisung

body {
background-color: #353535;
color: white;
}

Mich würde in erster Linie Interessieren warum die Anweisung in zwei verschiedenen
Dateien. Hat es mit den unterschiedlichen Farben zutun? Wenn ja warum?

Grüße Manfred
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 23.10.2008, 19:53
Benutzerbild von Gumbo
XHTMLforum-Kenner
 
Registriert seit: 22.08.2004
Ort: Trier
Beiträge: 2.737
Gumbo ist jedem bekanntGumbo ist jedem bekanntGumbo ist jedem bekanntGumbo ist jedem bekanntGumbo ist jedem bekanntGumbo ist jedem bekannt
Standard

Die „fundament.css“ gilt vermutlich für alle Medien, also auch dem Druck. Hier ist es sinnvoll, Schrift und Hintergrundfarbe zu definieren, um so mögliche Standardeinstellungen des Browsers zu überschreiben.
__________________
Markus Wulftange
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 23.10.2008, 23:55
Benutzerbild von pmmueller
Autor von "Little Boxes"
XHTMLforum-Mitglied
 
Registriert seit: 18.01.2005
Ort: Groningen (Niederlande)
Beiträge: 292
pmmueller sorgt für eine eindrucksvolle Atmosphärepmmueller sorgt für eine eindrucksvolle Atmosphäre
Standard

Zitat:
Zitat von Magellan Beitrag anzeigen
Mich würde in erster Linie Interessieren warum die Anweisung in zwei verschiedenen
Dateien. Hat es mit den unterschiedlichen Farben zutun? Wenn ja warum
Die Grundidee ist wie folgt:
  • Die fundament.css hat den Charakter einer projektübergreifenden Basis und stellt sinnvolle Standardeinstellungen vor. Du kannst dort natürlich auch andere Werte wählen.
  • Die bildschirm.css ist das Stylesheet für ein bestimmtes Projekt.
Viel Spaß weiterhin mit dem Buch
Peter
__________________
HTML & CSS lernen: »Einstieg in CSS« + »Flexible Boxes« | CMS lernen: »Websites erstellen mit Contao«
Mit Zitat antworten
  #4 (permalink)  
Alt 24.10.2008, 11:23
Benutzerbild von Magellan
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.02.2007
Ort: Zurzeit noch Meerane in Sachsen
Beiträge: 97
Magellan befindet sich auf einem aufstrebenden Ast
Standard

Ich hatte nicht gefragt warum gibt es zwei Dateien.

Mich würde Interessieren warum Du in beide Dateien eine Body Anweisung setzt.
Die dann auch noch unterschiedliche Werte haben.
Mit Zitat antworten
  #5 (permalink)  
Alt 24.10.2008, 11:55
Benutzerbild von mantiz
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 25.02.2007
Beiträge: 2.845
mantiz kann auf vieles stolz seinmantiz kann auf vieles stolz seinmantiz kann auf vieles stolz seinmantiz kann auf vieles stolz seinmantiz kann auf vieles stolz seinmantiz kann auf vieles stolz seinmantiz kann auf vieles stolz seinmantiz kann auf vieles stolz sein
Standard

So, wie ich es verstanden habe führt fundament.css eine Art CSS-Reset aus, wobei erstmal nur dafür gesorgt wird, dass das Markup vernünftig und Browserübergreifend gestyled wird.

Die bildschirm.css nimmt dann konkrete Einstellungen für das aktuelle Projekt vor, wo natürlich auch das body-Element anders aussehen kann.
Mit Zitat antworten
  #6 (permalink)  
Alt 24.10.2008, 12:46
Benutzerbild von pmmueller
Autor von "Little Boxes"
XHTMLforum-Mitglied
 
Registriert seit: 18.01.2005
Ort: Groningen (Niederlande)
Beiträge: 292
pmmueller sorgt für eine eindrucksvolle Atmosphärepmmueller sorgt für eine eindrucksvolle Atmosphäre
Standard

Zitat:
Zitat von Magellan Beitrag anzeigen
Mich würde Interessieren warum Du in beide Dateien eine Body Anweisung setzt. Die dann auch noch unterschiedliche Werte haben.
fundament.css enthält Reset und Restauration, um browserübergreifend eine allgemeine Grundlage für die Gestaltung zu erhalten:
Zitat:
Zitat von Seite 51 oben
Reset, Restaurierung der Abstände und grundlegende Formatierung werden zusammen in einem Stylesheet namens fundament.css gespeichert, das Sie seinem Namen entsprechend auch als Fundament für andere Projekte verwenden können.
Zusätzlich zur reinen Restaurierung in Kap. 2.2 habe ich in Kap. 2.3 noch "Die grundlegende Formatierung" mit in fundament.css eingebaut. Da die Datei projektübergreifend eingesetzt werden kann und sollte, sind die Farbwerte für body eine Art kleinster gemeinsamer Nenner zur guten Lesbarkeit: Hintergrund weiß, Textfarbe schwarz.

bildschirm.css ist das Stylesheet für das konkrete Projekt, und hier werden die Farbangaben gewählt, die du im aktuellen Projekt gerne hättest.

Die Erstellung einer solchen projektübergreifenden Gestaltungsgrundlage ist am sinnvollsten, wenn man auch wirklich mehrere Projekte hat. Wenn dir diese Vorgehensweise übertrieben erscheint und du sie "doppelt gemoppelt" findest (oder schlicht und einfach nicht magst), spricht überhaupt nichts dagegen, die Farbdeklarationen für body (oder gleich die gesamte grundlegende Formatierung) in fundament.css einfach weg zu lassen.

In Kapitel 2 geht es um das Prinzip der Aufteilung der Stylesheets und der Vorstellung einer allgemeinen Reset/Restaurationsdatei, die man immer wieder einsetzen kann, um nicht bei jeder Site wieder bei NULL anfangen zu müssen. Die Ausgestaltung einer solchen Datei im Detail ist zum Teil schlicht und einfach Geschmackssache

Hope it helps
Peter
__________________
HTML & CSS lernen: »Einstieg in CSS« + »Flexible Boxes« | CMS lernen: »Websites erstellen mit Contao«

Geändert von pmmueller (24.10.2008 um 12:55 Uhr)
Mit Zitat antworten
  #7 (permalink)  
Alt 24.10.2008, 13:48
Benutzerbild von Magellan
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.02.2007
Ort: Zurzeit noch Meerane in Sachsen
Beiträge: 97
Magellan befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von pmmueller Beitrag anzeigen
Hope it helps
Peter


Ja danke euch beiden.

Wie kann ich den sicherstellen, dass jeder Brwouser immer genau weiß
welche Anweisung den die ist die er darstellen soll.

LG Manfred
Mit Zitat antworten
  #8 (permalink)  
Alt 24.10.2008, 14:11
Benutzerbild von mantiz
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 25.02.2007
Beiträge: 2.845
mantiz kann auf vieles stolz seinmantiz kann auf vieles stolz seinmantiz kann auf vieles stolz seinmantiz kann auf vieles stolz seinmantiz kann auf vieles stolz seinmantiz kann auf vieles stolz seinmantiz kann auf vieles stolz seinmantiz kann auf vieles stolz sein
Standard

Du bindest die CSS-Dateien ja nacheinander ein, z.B. so (wie es im Buch ist, weiß ich nicht, da ich das Buch nicht kenne):

HTML-Code:
<link rel="stylesheet" type="text/css" href="fundament.css" media="screen" />
<link rel="stylesheet" type="text/css" href="bildschirm.css" media="screen" />
Nun werden beide Dateien nacheinander geladen und Anweisungen, welche im 2. CSS stehen überschreiben/ergänzen die Anweisungen, welche im 1. CSS stehen.

Code:
/* fundament.css */
body {
   color: #000;
   background: #FFF;
}
Code:
/* bildschirm.css */
body {
   color: #FFF;
   background: #000;
   padding: 1em;
}
Resultat für den Browser:
Code:
body {
   color: #FFF;  /* überschrieben */
   background: #000; /* überschrieben */
   padding: 1em; /* ergänzt */
}
Mit Zitat antworten
  #9 (permalink)  
Alt 24.10.2008, 14:17
Benutzerbild von pmmueller
Autor von "Little Boxes"
XHTMLforum-Mitglied
 
Registriert seit: 18.01.2005
Ort: Groningen (Niederlande)
Beiträge: 292
pmmueller sorgt für eine eindrucksvolle Atmosphärepmmueller sorgt für eine eindrucksvolle Atmosphäre
Standard

Zitat:
Zitat von mantiz Beitrag anzeigen
Du bindest die CSS-Dateien ja nacheinander ein, z.B. so (wie es im Buch ist, weiß ich nicht, da ich das Buch nicht kenne):
Im Buch wird ein zentrales Stylesheet namens zentrale.css mit @import verwendet:
Code:
/* Reset, Restaurierung und grundlegende Formatierung */
@import url(fundament.css); 

/* Formatierung der Navigation */
@import url(navi_inline.css); 

/* Formatierung für den Bildschirm */
@import url(bildschirm.css);
Die Stylesheets werden nacheinander geladen und im Rahmen der Kaskade (Little Boxes 1, Kap. 10) überschreiben die zuletzt geladenen die zuerst geladenen Deklarationen.

Oder anders ausgedrückt: Die Letzten werden die Ersten sein.
__________________
HTML & CSS lernen: »Einstieg in CSS« + »Flexible Boxes« | CMS lernen: »Websites erstellen mit Contao«

Geändert von pmmueller (24.10.2008 um 14:27 Uhr)
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 24.10.2008, 14:21
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.864
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Vorausgesetzt, ihre Spezifität ist mindestens genauso hoch
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten.
Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.)
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Little Boxes Dieter Ressourcen 43 15.11.2011 04:05
Little Boxes Teil 1: Crashkurs zu HTML und CSS online lesen pmmueller Ressourcen 6 25.02.2010 16:17
Bescheid: Little Boxes - Teil 0 (Null) pmmueller Ressourcen 29 28.12.2008 16:54
Little Boxes - Varianten FloZen Offtopic 14 03.06.2008 12:10
Suche PHP Buch ala Little Boxes Zen5656 Serveradministration und serverseitige Scripte 2 17.02.2007 14:39


Alle Zeitangaben in WEZ +2. Es ist jetzt 01:36 Uhr.