Baumstrukturmodus | Linearer Modus

Sam Fisher · 26.12.2007, 13:33

Hallo Leute !
Ich habe mal wieder ein kleines Problem bei dem ich eure Hilfe brauche. Es geht um folgendes: Ich habe in einer Seite folgende Stelle:

Code:

<hr color="#99cccc" width="95%"/>

Dieser Code funktioniert zwar, ist aber nicht valide. Da ich aber sehr viel Wert auf eine valide Webseite lege ist das nicht akzeptabel.
Deshalb habe ich folgenden Code probiert:

Code:

<hr style="color=#99cccc width=95%" />

Dieser Code ist zwar valide, aber wird aber nicht so dargestellt wie ich es gerne hätte. Was mache ich da falsch?
Vielen Dank im vorraus für die Hilfe.
Grüße
Sam

dino · 26.12.2007, 14:39

Sam Fisher schrieb:

Code:

<hr style="color=#99cccc width=95%" />

Der Fehler ist recht simpel Smile

In einem Stylesheet haben die attribute einen anderen Syntax als in reinem HTML und eigentlich müsste ein CSS-Validator dir auch einen Fehler ausspucken.
Wenn du style attribute verändern möchtest lautet der syntax immer

Code:

attributname: wert;

also müsste deine Zeile folgendermaßen aussehen:

Code:

<hr style="color:#99CCCC; width:95%;" />

Dann müsste das auch funktionieren, vermutlich weißt du es auch hast es nur in hektik vergessen, passiert mir auch ab und an mal Biggrin

Sam Fisher · (Dieser Beitrag wurde zuletzt bearbeitet: 26.12.2007 15:24 von Sam Fisher.)

Hallo !
Das funktioniert super. Nur die Farbe wird nicht dargestellt. Aber ich glaube, dass in diesem Fall color falsch ist. Aber das bekomme ich noch in den Griff.

Vielen Dank auf jeden Fall für deine schnelle Hilfe. War irgend wie echt peinlich, dass ich das selbst nicht überrissen habe. Biggrin

Vielen Dank
Sam

dino · 26.12.2007, 17:15

Naja passiert halt Smile

Dein Farbproblem könnte damit zusammenhängen, dass das CSS-Attribut "color" die Schriftfarbe bestimmt, versuch mal background-color, das sollte funktionieren, ist mir vorhin schon aufgefallen, hatte es aber vergessen zu erwähnen.

Para · (Dieser Beitrag wurde zuletzt bearbeitet: 27.12.2007 10:49 von Para.)

Mit background-color funktioniert es auf jeden Fall. Zusätzlich kannst du auch die Eigenschaft height verwenden. Allerdings solltest du niemals das style-Attribut benutzen: Lagere alle optischen Formate in einem externen Stylesheet aus. Ebenso wie Skripte.

Sam Fisher · 28.12.2007, 14:48

Para schrieb:Allerdings solltest du niemals das style-Attribut benutzen: Lagere alle optischen Formate in einem externen Stylesheet aus. Ebenso wie Skripte.

Hallo !
Das mache ich normalerweise auch, aber in diesem Fall geht das nicht, da dies ein Template für ein HTML E-Mail ist. Da habe ich lieber alles in einer Datei.
Aber der Rest ist schon so geschrieben:

Code:

<style type="text/css">

<!--

#fooo {

bar:xxx;

}

-->

</style>

Es ist schon getrennt, aber halt nicht in eine andere Datei.
Ich habe deshalb keine .class erstellt, da ich dies bei einem einzigen <hr /> für unnötig halte. Es ist in diesem Fall sogar mehr Text und somit länger zu laden.

Das kann man doch auch so machen, oder?
Grüße
Sam

Para · (Dieser Beitrag wurde zuletzt bearbeitet: 28.12.2007 21:47 von Para.)

Naja, das kann man schon machen, aber ich halte mich nun einmal an das Schichtenmodell.

1. Schicht: Struktur (XHTML)
2. Schicht: Präsentation (CSS)
3. Schicht: Verhalten (JavaScript)

Deshalb erachte ich es auch als falsch, optische Formate in einem style-Bereich unterzubringen statt in einer externen CSS-Datei. Ich mache das immer so:

Code:

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html lang="de" xml:lang="de" xmlns="http://www.w3.org/1999/xhtml" id="example-org">

<head>

<title>example.org</title>

<meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" />

<link rel="stylesheet" href="presentation/stylesheets/handheld/default.css" type="text/css" media="handheld" title="Default Handheld Stylesheet" />

<link rel="stylesheet" href="presentation/stylesheets/print/default.css" type="text/css" media="print" title="Default Print Stylesheet" />

<link rel="stylesheet" href="presentation/stylesheets/screen/default.css" type="text/css" media="screen" title="Default Screen Stylesheet" />

<script src="behaviour/scripts/scripts.js" type="text/javascript"></script>

</head>

<body id="layout">

<div class="area" id="header"></div>

<hr class="area_seperator" />

<div class="area" id="navigation"></div>

<hr class="area_seperator" />

<div class="area" id="content"></div>

<hr class="area_seperator" />

<div class="area" id="footer"></div>

</body>

</html>

Möglicherweise verwandte Themen...
Thema:		Verfasser	Antworten:	Ansichten:	Letzter Beitrag
	Woltlab Style ?	poetschke	8	1.158	14.05.2005 01:39 Letzter Beitrag: poetschke