Externe CSS-Datei für Hintergrundbild einer Tabelle
Wladimir Daiker
- html
Hallo allerseits,
ich möchte in einer bestimmten Tabellenspalte ein Hintergrundbild definieren.
Jetzt geht das nicht mit <td background...></td> da es nicht HTML-Standard-konform ist. Also habe ich in SELFHTML nachgeschaut und rausgefunden das es mit externer CSS Datei funktionieren kann.
Nur leider bin ich totaler HTML/CSS Anfänger und bekomme es nicht hin.
Meine Frage ist:
1. Wie soll der Text im <head> der HTML-Datei aussehen.
2. Wie muss die externe CSS-Datei aussehen?
3. Was kommt dann in den <td>-tag der HTML Datei?
Wäre dankbar wenn mir jemand helfen würde, muss es bis Montag fertig haben.
Danke und viele Grüsse
Hallo Wladimir.
ich möchte in einer bestimmten Tabellenspalte ein Hintergrundbild definieren.
Jetzt geht das nicht mit <td background...></td> da es nicht HTML-Standard-konform ist.
Zudem erreichst du hierbei lediglich, dass einer Tabellen*zelle* ein Hintergrund verpasst wird, jedoch nicht einer Tabellen*spalte*. Hierzu müsstest du ein zugehöriges http://de.selfhtml.org/html/tabellen/aufbau.htm#vordefinieren@title=col-Element formatieren.
Meine Frage ist:
- Wie soll der Text im <head> der HTML-Datei aussehen.
- Wie muss die externe CSS-Datei aussehen?
<http://de.selfhtml.org/css/formate/einbinden.htm#separat@title=SELFHTML: Formate zentral in separater CSS-Datei definieren>
- Was kommt dann in den <td>-tag der HTML Datei?
<http://de.selfhtml.org/css/formate/zentrale.htm#individualformate@title=SELFHTML: Individualformate definieren>
Einen schönen Freitag noch.
Gruß, Mathias
Hallo Mathias
erstmal Danke für die schnelle Antwort. Die Tabelle ist schon lange fertig.
Die Links die Du angibst habe ich mir schon angeschaut. Die sind jedoch zu allgemein gefasst und bringen mich nicht weiter.
Gruß, Wladimir
Hallo Wladimir.
Die Links die Du angibst habe ich mir schon angeschaut. Die sind jedoch zu allgemein gefasst und bringen mich nicht weiter.
Dann solltest du beschreiben, wo *genau* es denn nun hakt und welcher Teil der Beschreibungen in SELFHTML dir unverständlich erscheint.
Einen schönen Samstag noch.
Gruß, Mathias
Hallo Mathias,
also ich hab folgendes bereits selbst rausgefunden, korrigier mich bitte wenn ich falsch liege:
Also in den HTML-Datei irgendwo im <head> kommt:
<link rel="stylesheet" type="text/css" href="dateiname.css">.
Aber was kommt in den <td>-tag der HTML-Tabelle???
In die externe CSS-Datei kommt:
<style type="text/css">
div.bg {
background-image: url(../images/bg.gif);
}. Richtig?
Wie lege ich die CSS-und HTML-Dateien auf dem Server ab???
Gruß Wladimir
Hallo Wladimir.
also ich hab folgendes bereits selbst rausgefunden, korrigier mich bitte wenn ich falsch liege:
Also in den HTML-Datei irgendwo im <head> kommt:
<link rel="stylesheet" type="text/css" href="dateiname.css">.
Soweit korrekt.
Aber was kommt in den <td>-tag der HTML-Tabelle???
Du kannst dem td-Element entweder eine ID oder eine Klasse zuweisen. (Tatsächlich kannst du sogar beides, doch dürfte dies für dich hier nicht relevant sein.)
Siehe hierzu auch die von mir bereits verlinkten Anmerkungen zu Individualformaten.
In die externe CSS-Datei kommt:
<style type="text/css">
div.bg {
background-image: url(../images/bg.gif);
}. Richtig?
Nein, „<style type="text/css">“ ist kein gültiger Selektor sondern bloßes HTML. So etwas hat in einem externen Stylesheet nichts zu suchen.
Bliebe also folgendes:
div.bg {
background-image: url(../images/bg.gif);
}
Damit würdest du einem div-Element, welches der Klasse „bg“ angehört eine Hintergrundgrafik. Doch wolltest du nicht eigentlich einem td-Element einen Hintergrund verpassen? Ein zusätzliches div-Element ist hier gänzlich überflüssig.
Wie lege ich die CSS-und HTML-Dateien auf dem Server ab???
Mit einem http://de.selfhtml.org/intro/hilfsmittel/software.htm#ftp@title=FTP-Client.
Einen schönen Samstag noch.
Gruß, Mathias
Hallo Mathias,
»»Du kannst dem td-Element entweder eine ID oder eine Klasse »»zuweisen. (Tatsächlich kannst du sogar beides, doch dürfte dies für »»dich hier nicht relevant sein.)
Genau das ist noch mein Problem. Was ist eine ID oder eine Klasse? Schreib mir bitte genau auf was in den <td>-tag reinkommt damit es klappt.
Bliebe also folgendes:
div.bg {
background-image: url(../images/bg.gif);
}
>
> Damit würdest du einem div-Element, welches der Klasse „bg“ angehört eine Hintergrundgrafik. Doch wolltest du nicht eigentlich einem td-Element einen Hintergrund verpassen? Ein zusätzliches div-Element ist hier gänzlich überflüssig.
Das steht dann nacher in der externen CSS:
~~~css
bg td{
background-image: url(../images/bg.gif);
}
~~~ richtig?
und die wird zusammen mit HTML-Datei in einen Ordner auf dem Server abgelegt.
Ich hab noch was:
da man den tag <font> für eine Schriftfarbe nicht benutzen soll habe ich den tag-<basefont> genommen. Nun ist meine HTML-Datei valide aber Firefox zeigt die Farbe nicht richtig an. Was kann man da tun?
Gruß Wladimir
Hallo Wladimir,
Genau das ist noch mein Problem. Was ist eine ID oder eine Klasse?
Bitte lies dir http://de.selfhtml.org/css/formate/zentrale.htm durch. Dort wird einiges von dem, was du Fragst erklärt.
da man den tag <font> für eine Schriftfarbe nicht benutzen soll habe ich den tag-<basefont> genommen. Nun ist meine HTML-Datei valide aber Firefox zeigt die Farbe nicht richtig an. Was kann man da tun?
Du solltest keines von beiden Benutzen. CSS bietet viel mehr Möglichkeiten zur Formatierung und hilft dabei, Design und Markup voneinander zu trennen.
Schöne Grüße,
Johannes
Hallo,
Das steht dann nacher in der externen CSS:
bg td{
background-image: url(../images/bg.gif);
}
> Richtig?
Nein, falsch. Das Problem ist, dass du nicht verstehst wie CSS funktioniert. Ich versuche es mal mit Hilfe von Beispielen zu beschreiben:
~~~css
strong { color: red; }
/* wirkt auf alle [code lang=html]<strong>
~~~ \*/
.foo { color: red; }
/\* wirkt auf alle Elemente mit dem class Attribut "foo",
z.B.: `<strong class="foo">`{:.language-html} oder auch `<p class="foo">`{:.language-html} \*/
#foo { color: red; }
/\* wirkt auf alle Elemente mit der ID "foo", z.B.: `<strong id="foo">`{:.language-html}
oder auch `<div id="foo">`{:.language-html} \*/
strong.foo { color: red; }
/\* wirkt auf alle <strong>-Elemente mit der klasse "foo", z.B.:
`<strong class="foo">`{:.language-html} aber \_nicht\_ auf <p class="foo"> \*/
#foo .foo { color: red; }
/\* wirkt auf alle Elemente mit der Klasse "foo", die \_innerhalb\_
eines Elements sind, das die ID "foo" hat, z.B.:
`<p id="foo"><strong>hallo</strong> ich bin <strong class="foo">es</strong>.</p>`{:.language-html}
hier wird nur "es" rot dargestellt.[/code]
> und die wird zusammen mit HTML-Datei in einen Ordner auf dem Server abgelegt.
Ja das funktioniert, allerdings mache ich mir immer einen extra css Ordner und lege da meine CSS Dateien ab.
> da man den tag <font> für eine Schriftfarbe nicht benutzen soll habe ich den tag-<basefont> genommen. Nun ist meine HTML-Datei valide aber Firefox zeigt die Farbe nicht richtig an. Was kann man da tun?
Was ist <basefont>? Habe ich irgendwie noch nie gehört. Merke dir einfach, dass du alles was mit aussehen zu tun hast über CSS machen sollst und in einer Externen CSS-Datei notierst.
Grüße
Jeena Paradies
--
[LoadRemoteHTML()](http://jeenaparadies.net/weblog/2006/nov/load-remote-html) - Daten einfach nachladen | [Jlog](http://jeenaparadies.net/webdesign/jlog/) | [Gourmetica Mentiri](http://jeenaparadies.net/gourmetica-mentiri/)