HTML Tabelle designen

xCiiD · 16. Juli 2013

Hallo !

Ich bin mir ziemlich sicher das das hier nicht das richtige Forum ist aber da mit die freunde im CSS forum nicht helfen können frage ich mal hier. >>SO<< sieht die tabelle im aktuellen Forum aus welches nur noch solage da ist, bis die richtige page fertig ist. Abgesehen von der leichten umrandung gefällt es mir. >>SO<< sieht das ganze hingegen auf der anderen page aus, der container sieht besser aus und stört weniger aber wo ist der hintergrund? Der hover funktioniert.

Das hier ist der Code:

Spoiler anzeigen

Code

<style type="text/css">
table,td { border : 1px solid #CCC; border-collapse : collapse; font : small/1.5 "Tahoma", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif; } table { border :none; border :1px solid #CCC; } thead th, tbody th { background : #FFF url(th_bck.gif) repeat-x; color : #666; padding : 5px 10px; border-left : 1px solid #CCC; } tbody th { background : #fafafb; border-top : 1px solid #CCC; text-align : left; font-weight : normal; } tbody tr td { padding : 5px 10px; color : #666; } tbody tr:hover { background : #FFF url(tr_bck.gif) repeat; } tbody tr:hover td { color : #454545; } tfoot td, tfoot th { border-left : none; border-top : 1px solid #CCC; padding : 4px; background : #FFF url(foot_bck.gif) repeat; color : #666; } caption { text-align : left; font-size : 120%; padding : 10px 0; color : #666; } table a:link { color : #666; } table a:visited { color : #666; } table a:hover { color : #003366; text-decoration : none; } table a:active { color : #003366; }</style>
<table border="1" width="100%">
	<tbody>
		<tr>
			<th style="text-align: center;">
				<span style="font-size:16px;"><strong>Charakter</strong></span></th>
			<th style="text-align: center;">
				<span style="font-size:16px;"><strong>Erbeuteter Gegenstand</strong></span></th>
			<th style="text-align: center;">
				<span style="font-size:16px;"><strong>Raid</strong></span></th>
		</tr>
		<tr>
		</tr>
		<tr>
			<td style="text-align: center;">
				<a href="http://eu.battle.net/wow/de/character/shadowsong/Todesritter/simple"><strong><span style="color:#cc0033;">Todesritter</span></strong></a></td>
			<td style="text-align: center;">
				<a href="http://de.wowhead.com/item=96569">Wird geladen...</a></td>
			<td style="text-align: center;">
				<a href="http://eu.battle.net/wow/de/zone/throne-of-thunder/"><span style="color:#0000cd;"><strong>TdD</strong></span></a></td>
		</tr>
		<tr>
			<td style="text-align: center;">
				<a href="http://eu.battle.net/wow/de/character/frostwolf/Pandarina/simple"><span style="color:#006666;"><strong>Pandarina</strong></span></a></td>
			<td style="text-align: center;">
				<a href="http://de.wowhead.com/item=95274">Wird geladen...</a></td>
			<td style="text-align: center;">
				<a href="http://eu.battle.net/wow/de/zone/throne-of-thunder/"><span style="color: rgb(0, 0, 205);"><strong>TdD</strong></span></a></td>
		</tr>
	</tbody>
</table>
<br />

Alles anzeigen

Der code ist bei beiden identisch und wir in der Seitenverwaltung auch noch richtig angezeigt also mit Hintergrund. Nun habe ich zwei optionen entweder es liegt am Styl oder es liegt an der tabelle das da garkein hintergrund definiert ist. Da ich aber einen brauche, am besten in der selben Farbe wie auf der seite wo es "richtig" angezeigt wird wollte ich hier mal nett darum bitten das mir den code jemand dahingehend anpassen kann da ich dafür leider zu unfähig bin das einfügen eines backgrounds hat bei mir keinen erfolg gezeigt.

Tom · 16. Juli 2013

Ich weiss jetzt nicht was du genau meinst:

CSS

thead th, tbody th {
    color: #FFFFFF;
}
tbody th {
    background: rgba(255, 255, 255, 0.3);
}
table, td {
    border: 1px solid rgba(255, 255, 255, 0.3);
}

xCiiD · 16. Juli 2013

Alles klar, hat sich erledigt danke dir ! dann fehlt nur noch der youtube button und das guilded problem.

HTML Tabelle designen

cls-design

Informationen

Demoinstallationen

Hilfe