Du bist nicht angemeldet.

Stilllegung des Forums
Das Forum wurde am 05.06.2023 nach über 20 Jahren stillgelegt (weitere Informationen und ein kleiner Rückblick).
Registrierungen, Anmeldungen und Postings sind nicht mehr möglich. Öffentliche Inhalte sind weiterhin zugänglich.
Das Team von spieleprogrammierer.de bedankt sich bei der Community für die vielen schönen Jahre.
Wenn du eine deutschsprachige Spieleentwickler-Community suchst, schau doch mal im Discord und auf ZFX vorbei!

Frage zum Thema CSS Tabellen und Globale Code

Werbeanzeige

TigerClaw25

unregistriert

1

01.12.2013, 08:48

Frage zum Thema CSS Tabellen und Globale Code

Hallo Zusammen,

habe eine Frage zum Thema CSS. Ich nutze für meine Webseiten ganz normal eine design.cc und eine content.css, wo unter anderem für Tabellen die Attribute bzw. Eigenschaften definiert sind. Nun möchte ich aber speziell für eine Tabelle, die ich nur für Hardware-Spezifikationen nutze, ganz andere Eiugenschaften verwenden. Wenn ich nun für tabel, tr, td etc.. neue Styles anlege, dann sind alle Tabellen auf der Webseite betroffen. Daher meine Frage, welche Methgode da einfacher wäre?

Wäre es nicht am einfachjsten, wenn ich genau dort, wo die Tabelle erscheinen soll, den Code einfüge inkl. Stylesheet?

C-/C++-Quelltext

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96

<style type="text/css" title="text/css">
#mytable {
    width: 700px;
    padding: 0;
    margin: 0;
}

caption {
    padding: 0 0 5px 0;
    width: 700px;    
    font: italic 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    text-align: right;
}

th {
    font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    color: #4f6b72;
    border-right: 1px solid #C1DAD7;
    border-bottom: 1px solid #C1DAD7;
    border-top: 1px solid #C1DAD7;
    letter-spacing: 2px;
    text-transform: uppercase;
    text-align: left;
    padding: 6px 6px 6px 12px;
    background: #CAE8EA url(images/bg_header.jpg) no-repeat;
}

th.nobg {
    border-top: 0;
    border-left: 0;
    border-right: 1px solid #C1DAD7;
    background: none;
}

td {
    border-right: 1px solid #C1DAD7;
    border-bottom: 1px solid #C1DAD7;
    background: #fff;
    padding: 6px 6px 6px 12px;
    color: #4f6b72;
}


td.alt {
    background: #F5FAFA;
    color: #797268;
}

th.spec {
    border-left: 1px solid #C1DAD7;
    border-top: 0;
    background: #fff url(images/bullet1.gif) no-repeat;
    font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
}

th.specalt {
    border-left: 1px solid #C1DAD7;
    border-top: 0;
    background: #f5fafa url(images/bullet2.gif) no-repeat;
    font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    color: #797268;
</style>

<table id="mytable" cellspacing="0" summary="Maximale Taktrate">
<caption>Table 1: Power Mac G5 tech specs </caption>
  <tr>
    <th scope="col" abbr="Configurations" class="nobg">Configurations</th>
    <th scope="col" abbr="Dual 1.8">Dual 1.8GHz</th>
    <th scope="col" abbr="Dual 2">Dual 2GHz</th>
    <th scope="col" abbr="Dual 2.5">Dual 2.5GHz</th>
  </tr>
  <tr>
    <th scope="row" abbr="Model" class="spec">Model</th>
    <td>M9454LL/A</td>
    <td>M9455LL/A</td>
    <td>M9457LL/A</td>
  </tr>
  <tr>
    <th scope="row" abbr="G5 Processor" class="specalt">G5 Processor</th>
    <td class="alt">Dual 1.8GHz PowerPC G5</td>
    <td class="alt">Dual 2GHz PowerPC G5</td>
    <td class="alt">Dual 2.5GHz PowerPC G5</td>
  </tr>
  <tr>
    <th scope="row" abbr="Frontside bus" class="spec">Frontside bus</th>
    <td>900MHz per processor</td>
    <td>1GHz per processor</td>
    <td>1.25GHz per processor</td>
  </tr>
  <tr>
    <th scope="row" abbr="L2 Cache" class="specalt">Level2 Cache</th>
    <td class="alt">512K per processor</td>
    <td class="alt">512K per processor</td>
    <td class="alt">512K per processor</td>
  </tr>
</table>

TrikkieMikkie

Supermoderator

Beiträge: 3 731

  • Private Nachricht senden

2

01.12.2013, 10:00

Nachdem du die Grundeigenschaften für alle Tabellen festgelegt hast (content.css),
könntest du für bestimmte Tabellen Eigenschaften über die ID definieren:

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14

/* Für alle Tabellen */
blablabla

/* Tabelle mit der ID hardwarespecs */
table#hardwarespecs {
...
}

#hardwarespecs th {
...
}
#hardwarespecs td {
...
}
fka tm

Strike

Frischling

Beiträge: 36

Wohnort: Wien 1200 und Techelsberg 9212

Beruf: Junior Software-Entwickler & Software Testing

  • Private Nachricht senden

3

01.12.2013, 11:04

Ja das stimmt spezielle Zuweisungen sind per IDs und Klassen möglich.
Diese sind dann auch mehrfach verwendbar usw.

Für Details hier ein Link zur CSS-Kurzreferenz von SelfHTML:
http://de.selfhtml.org/navigation/css.htm


:thumbsup:

TigerClaw25

unregistriert

4

01.12.2013, 12:34

Danke, das werde ich so machen :)

Sacaldur

Community-Fossil

Beiträge: 2 301

Wohnort: Berlin

Beruf: FIAE

  • Private Nachricht senden

5

03.12.2013, 14:47

IDs sollte man nur dann verwenden, wenn man ein Element eindeutig referenzieren muss (bspw. über eine URL oder aus JavaScript-code heraus). In diesem Fall wäre also eine Klasse zur weiteren Umschreibung der Tabelle besser geeignet.
Auch finde ich, dass man in CSS möglichst wenig Eigenschaftszuweisungen über Elementselektoren vornehmen sollte, sondern möglichst nur mit Klassen arbeiten sollte. Es gibt durchaus Ausnahmen, in denen man keine Klasse verwenden kann, aber das sollten auch Ausnahmen bleiben.
Und auch wenn es eher eine Kleinigkeit ist, sollte der CSS Code idealerweise auch nicht direkt in die HTML-Seite eingebunden sein. (Dabei kann man dann für verschiedene Zwecke auch unterschiedliche *.css-Dateien verwenden.)

Neben SelfHTML könnte aber auch CSS4You.de ganz interessant sein, vor allem der "Wie fange ich an?" Workshop (auf der SelfHTML-Seite habe ich immerhin nichts zur Berechnung der Spezifität gesehen).

Und es wäre ganz gut, wenn du ganz normale Code-Tags verwenden würdest und nicht die für C++, da der Code sonst auf unsinnige Weise hervorgehoben wird.
Spieleentwickler in Berlin? (Thema in diesem Forum)
---

Zitat von »Jonathan_Klein«

Es ist ja keine Schande etwas falsch zu machen, als Programmierer tu ich das täglich, [...].

Werbeanzeige

Ähnliche Themen