zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Tabelle mit CSS formatieren

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 03.08.2011, 15:04
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.10.2008
Beiträge: 7
AndreasB80 befindet sich auf einem aufstrebenden Ast
Standard Tabelle mit CSS formatieren

Hallo zusammen,

ich brings irgendwie nicht hin, beziehungsweise sitze auf der Leitung.

Ich möchte eine Tabelle global per CSS wie im Bild "Soll-Zustand" formatieren, meinen derzeitigen Stand seht ihr im Bild "Ist-Zustand".

Ziel ist, dass nur in der Zeile der Hintergrund blau ist und die inneren Rahmen weiß sind.

Wie mache ich das?

Mein derzeitiger HTML-Code:
HTML-Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>TEST</title>
<style type="text/css">
* { font-family:tahoma;font-size:12px; }
table { width:530px;table-layout:fixed;border-collapse:collapse;border:1px solid #5A94CE; }
table td { border:1px solid #5A94CE;padding:8px 5px; }
table td.bgblue { border:1px solid #FFFFFF;background-color:#5A94CE;color:#FFFFFF; }
table td.bgblue b { color:#FFFFFF; }
</style>
</head>
<body>
<table cellpadding="0" cellspacing="0" border="0">
	<tr>
		<td class="bgblue">&nbsp;</td>
		<td class="bgblue"><b>Spalte 1</b></td>
		<td class="bgblue"><b>Spalte 2</b></td>
		<td class="bgblue"><b>Spalte 3</b></td>
	</tr>
	<tr>
		<td>Zeile 1</td>
		<td>&nbsp;</td>
		<td>&nbsp;</td>
		<td>&nbsp;</td>
	</tr>
	<tr>
		<td>Zeile 2</td>
		<td>&nbsp;</td>
		<td>&nbsp;</td>
		<td>&nbsp;</td>
	</tr>
	<tr>
		<td>Zeile 3</td>
		<td>&nbsp;</td>
		<td>Inhalte der Tabelle können auch mehrzeilig sein</td>
		<td>&nbsp;</td>
	</tr>
</table>
</body>
</html>
Danke und viele Grüße,
Andreas
Angehängte Grafiken
Dateityp: png Ist-Zustand.png (3,8 KB, 9x aufgerufen)
Dateityp: png Soll-Zustand.png (20,3 KB, 10x aufgerufen)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 03.08.2011, 15:14
Standardkatze
XHTMLforum-Kenner
 
Registriert seit: 06.02.2007
Beiträge: 1.823
gato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nett
Standard

Wem willst du hier was über Tabellen erzählen?

cellpadding? raus, dafür gibts padding.
cellspacing? raus, das ist schon Null wegen border-collapse: collapse;
border? raus, das ist von Haus aus Null.

Warum beschränkst du dich auf drei Tabellenelemente? Schon mal was von th gehört? Das macht sowohl die Klasse als auch das unsinnige b-Element überflüssig. Ist doch praktisch eine gute Struktur zu haben, nicht?

Wenn du dann mal eine sinnvolle Struktur hast, gibst du den th-Elementen zunächst auch einen blauen Rahmen und einen seitlichen weißen Rahmen. Den überflüssigen weißen Rahmen (entweder links oder rechts) färbst du dann auch wieder blau ein. :first-child bietet sich der Kompatibilität wegen an.
__________________
Über Internet Explorer 8:
Noch bis 8. April 2014 wird der Internet Explorer 6 mit Sicherheitsupdates versorgt.
Bereits jetzt kann dieser Browser aber vollständig durch den IE8 ersetzt werden. Ältere Betriebssysteme und Browserversionen werden von Microsoft nicht mehr unterstützt.
Auch Programme, die den IE7 benötigen, sind kein Argument gegen IE8, da dieser über entsprechende Kompatibilitätsschichten verfügt.
Ab sofort gilt daher der Internet Explorer 8 als vorausgesetzer Mindeststandard.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 03.08.2011, 15:22
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.10.2008
Beiträge: 7
AndreasB80 befindet sich auf einem aufstrebenden Ast
Standard

Vom th-Tag hab ich natürlich was gehört.
Das Problem ist nur, dass das mir zur Verfügung stehende CMS kein th in den Tabellen erzeugt.

Kann ich das Problem dann trotzdem lösen?
Mit Zitat antworten
  #4 (permalink)  
Alt 03.08.2011, 15:29
Standardkatze
XHTMLforum-Kenner
 
Registriert seit: 06.02.2007
Beiträge: 1.823
gato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nett
Standard

Klar, auf die selbe Weise wie beschrieben, dann muss halt das :first-child der vohandenen Klasse angehören. Mehr nicht.
__________________
Über Internet Explorer 8:
Noch bis 8. April 2014 wird der Internet Explorer 6 mit Sicherheitsupdates versorgt.
Bereits jetzt kann dieser Browser aber vollständig durch den IE8 ersetzt werden. Ältere Betriebssysteme und Browserversionen werden von Microsoft nicht mehr unterstützt.
Auch Programme, die den IE7 benötigen, sind kein Argument gegen IE8, da dieser über entsprechende Kompatibilitätsschichten verfügt.
Ab sofort gilt daher der Internet Explorer 8 als vorausgesetzer Mindeststandard.
Mit Zitat antworten
  #5 (permalink)  
Alt 03.08.2011, 15:36
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.10.2008
Beiträge: 7
AndreasB80 befindet sich auf einem aufstrebenden Ast
Standard

Danke, man braucht halt einfach immer einen kleinen Gedankenanstoß, damits weiter geht

HTML-Code:
table { width:530px;table-layout:fixed;border-collapse:collapse;border:1px solid #5A94CE; }
table td { border:1px solid #5A94CE;padding:8px 5px; }
table td.bgblue { border:0px none;border-left:1px solid #FFFFFF;background-color:#5A94CE;color:#FFFFFF; }
table td.bgblue:first-child { border-left:1px solid #5A94CE; }
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Tabelle mit CSS Formatieren? manolo CSS 1 28.05.2009 14:49
CSS (seperate datei), NAV- & Hauptfenster, TABELLE hmmm² CSS 4 25.08.2005 10:35
Tabelle mit CSS zentrieren to.ni CSS 8 27.02.2004 10:33
Tabelle mit CSS formatieren Anonymous CSS 11 23.06.2003 09:36


Alle Zeitangaben in WEZ +2. Es ist jetzt 14:23 Uhr.