CSS soll nur für Tabelle gelten

html.de-Forum HTML, XHTML & CSS
1

Hallo!
Ich will folgende Tabelle in meine Homepage einbauen:

Tabelle
2

Die Angaben, die Du gemacht hast, gelten doch nur für Tabellen.
Wenn es denn nur für diese eine Tabelle gelten soll, und noch andere Tabellen auf der Seite sind, dann würde sich eine (eindeutige!) ID anbieten.

Im Stylesheet musst Du dan darauf reflektieren. Also z.B. „table#tabellenbezeichnung“. Informiere Dich am besten über die CSS-Selektoren.

3

Genau, es soll nur für die eine Tabelle gelten…

Wie gesagt, ich bin Anfänger…

Kann mir jmd. zeigen wie das ganze dann aussehen würde, wenn man es mit einer ID machen würde?

Wäre super nett…

4

Naja, hab ich doch.

Zusätzlich schreibst Du im Stylesheet noch vor die Elemente einer Tabelle das „table#tabellenbezeichnung“ davor, z.B. „table#tabellenbezeichnung caption“, dann bezieht sich das nur auf die Elemente „caption“, die innerhalb eines Elements „table“ mit der ID „tabellenbezeichnung“ liegen.

5

Hm… Danke, aber ich weiß jetzt nich wo ich das alles einsetzen soll…:frowning:

Kannst du das vllt gerade für mich an dem Beispiel:

Tabelle
6

Dann solltest Du Dich mit den Grundlagen von CSS vertraut machen. Du wirst es ohnehin immer wieder brauchen.

Kannst du das vllt gerade für mich an dem Beispiel:
…hier machen?

Nein, tut mir leid. Ich helfe anderen, ich mache aber nicht deren Arbeit.
Ich möchte auch nicht, dass ich Dir das jetzt abändere und Du dann in 2 Tagen die selbe Frage wieder stellst, und wieder nicht weiter weißt.

Du weißt, dass es CSS ist, Du weißt von Klassen und von IDs und auch von Selektoren. Damit sollte man bei Google was finden, wo man sich einlesen kann.

Ansonsten findet sich vielleicht jemand anders, oder Du gehst in die Jobbörse.

Viel Erfolg,
-Efchen

7

Thx

Naja, dann halt nicht, ich wollte das ja nur als Vorlage…:frowning:
Mir Vorlagen lassen sich so Sachen nunmal besser erarbeiten…

Trotzdem vielen Dank!!!

8 
<table id="einzigetabelle">

im style dann

[CODE]table#einzigetabelle
{

border:1;
irgendwas:irgendwie;
}

table.td#einzigetabelle
{
color:red;
}

[/CODE]

9

So, hab das ganze jetzt versucht, aber es ist Fehlgeschlagen:

Tabelle
10

Danke, hab den Fehler selbst gefunden!

11

Es waren ja etliche. Die erste Zeile gleich, mit öffnender Klammer, aber ohne schließende. Und der Hinweis auf den Namen der ID muss vor jede Definition, die nur für diese eine Tabelle gelten soll.

Aber was anderes als sysop hab ich eigentlich auch nicht geschrieben…

12

Oh mann… hast recht:sad:

Ich verzweilfel noch daran…

Tabelle
13

Du hast es noch immer nicht vor jedem einzelnen Abschnitt eingebaut:

<style  type="text/css">  
<!--  
table#tabellenbezeichnung, table#tabellenbezeichnung td
{
	border               : 1px solid #CCC;
	border-collapse      : collapse;
  font                 : small/1.5 "Tahoma", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
}
table#tabellenbezeichnung
{
	border                :none;
	border                :1px solid #CCC;
}
table#tabellenbezeichnung thead th,
table#tabellenbezeichnung tbody th
{
	background            : #FFF url(th_bck.gif) repeat-x;
  color                 : #666;  
	padding               : 5px 10px;
  border-left           : 1px solid #CCC;
}
table#tabellenbezeichnung tbody th
{
  background            : #fafafb;
  border-top            : 1px solid #CCC;
  text-align            : left;
  font-weight           : normal;
}
table#tabellenbezeichnung tbody tr td
{
	padding               : 5px 10px;
  color                 : #666;
}

usw.

Du kannst natürlich anstatt „tabellenbezeichnung“ auch einen sprechenderen Namen für Deine Tabelle wählen. Das sollte von mir nur der Hinweis sein, dass Du anstelle dieses Bezeichners Deinen eigenen Namen einsetzen kannst (nein, nicht Deinen Vor- oder Nachnamen ;-))

Außerdem ist mir aufgefallen, dass Du für einige Elemente Eigenschaften definierst, die Du dann in einem zweiten Block wieder anders setzt. Außerdem setzt Du für ein Element teilweise ein und die selbe Eigenschaft mit verschiedenen Werten.

Nochmal zur Erklärung:

  • „table#tabellenbezeichnung“ bezieht sich auf das HTML-Element „table“ mit der ID (#) „tabellenbezeichnung“.
  • „table#tabellenbezeichnung td“ bezieht sich nur auf das Element „td“, das ein Nachfahre des Elements „table“ mit der ID (#) „tabellenbezeichnung“. Nachfahre heißt dabei, es kommt irgendwo innerhalb dieses Elements, als Kind, Enkel, Urenkel usw.
  • „table#tabellenbezeichnung > td“ bezieht sich hingegen auf ein „td“ als Kind (also direkt unterhalb) von „table“. Sowas gibt es aber bei Tabellen nicht, denn dazwischen kommt ja immer noch ein „tr“.
  • „table#tabellenbezeichnung tbody tr td“ bezieht sich auf das Element „td“, das irgendwo innerhalb eines „tr“ ist, das wiederum innerhalb eines „tbody“ steht, das wiederum innerhalb eines Elements „table“ mit der ID (#) „tabellenbezeichnung“ steht.

Alles klar? :slight_smile:

Grüße,
-Efchen

Ich seh da grad noch einen Fehler:

<table id="tabellenbezeichnung">
<TABLE border="0" class="mceVisualAid">

Du öffnest eine Tabelle und öffnest dann noch eine Tabelle. Das geht so natürlich auch nicht. Du musst der Tabelle, die Du formatieren willst, mit der ID versehen, also vermute ich mal, Du willst das:

<TABLE border="0" class="mceVisualAid" id="tabellenbezeichnung">
14

Danke!

Vielen, Vielen, Vielen Dank Elfchen:!:

Da hast du einen Härtefall erledigt und ich bin super Happy das alles hinbekommen zu haben…

Hier also der richtige Code:

Tabelle
Zeile 1xy*asda*adasd**ads
Zeile 2xx*ad*ada*ad
Zeile 3xxy*asad*asd*asda
Zeile 4*dsd*asd*ads*asd
Zeile 5*sdas*ads*ad*asd

xxx*xxx*
*xxx*xxx
15

Na, ich hoffe nur, Du hast auch ein bisschen was verstanden :slight_smile:

Diese Elemente sind aber weiterhin für alle Tabellen definiert, das schreibe ich nur hin, damit Du prüfen kannst, ob Du das so willst.

tbody tr:hover td
caption
table a:link
table a:visited
table a:hover
table a:active

Wenn Du Leerzeilen zwischen den einzelnen Abschnitten einstreust oder wenigstens die Eigesncahften einrückst, wird es übersichtlicher.

Schönes Wochenende,
-Efchen

16

Danke, hatte ich übersehen, war aber nicht tragisch, da dort eh nichts drinstand, was Tabellen groß verändert…

Danke nochmals Elfchen;heart :wink:

Hier jetzt der absolut korrekte Code:

Tabelle
Zeile 1xy*asda*adasd**ads
Zeile 2xx*ad*ada*ad
Zeile 3xxy*asad*asd*asda
Zeile 4*dsd*asd*ads*asd
Zeile 5*sdas*ads*ad*asd

xxx*xxx*
*xxx*xxx