Karteireiterleiste mit css
- Ersteller toom
- Erstellt am
- Status
M
matibaski
Guest
Die haun' mehrere Container nebeneinander mit float:right/left und schreiben einen Code für den aktiv-Status, sodass es ein anderes Hintergrundbild bekommt.
So einfach ;)
Etwa so:
Natürlich kann man diesen Code erweitern.
Hovereffekte, usw...
MfG, matibaski
So einfach ;)
Etwa so:
HTML:
<html>
<head>
<title>Registerkarten</title>
<style type="text/css">
.registerkarte {
background: url(registerkaten/bild.jpg) no-repeat;
width: ??px;
height: ??px;
border: 0px;
float:left;
display: block;
}
.registerkarte:active {
background: url(registerkaten/aktiv.jpg) no-repeat;
width: ??px;
height: ??px;
border: 0px;
float:left;
}
.abstand_zwischen_registerkarten {
float:left;
width: ??px;
}
</style>
<body>
<div class="registerkarte">Registerkarte 1</div>
<div class="abstand_zwischen_registerkarten"></div>
<div class="registerkarte">Registerkarte 2</div>
</body>
</html>Hovereffekte, usw...
MfG, matibaski
Mit der Methode habe ich ein Problem.
1) Folgendes Layout habe ich erstellt:
Die Frage ist im Div bereich enthalten.
2) Weiterhin verstehe ich den css Befehl display:block; nicht. WAs bewirkt der in dem Layout oben ?
3) Warum habe ich zwischen Tabellen immer einen Abstand:
1) Folgendes Layout habe ich erstellt:
HTML:
<div style="padding:5px;border:1px solid;float:left;">erste
</div>
<div style="border:1px solid;float:left;">zweite
</div>
<br />
<div style="border:1px solid;">Warum überschneiden sich diese div-Bereiche?
</div>2) Weiterhin verstehe ich den css Befehl display:block; nicht. WAs bewirkt der in dem Layout oben ?
3) Warum habe ich zwischen Tabellen immer einen Abstand:
HTML:
<div style="margin:0;padding:0;">
<table style="margin:0;padding:0;">
<tr style="margin:0;padding:0;">
<td style="border:1px solid;margin:0;padding:0;">Feld 1</td>
<td style="border:1px solid;margin:0;padding:0;">Feld 2</td>
<td style="border:1px solid;margin:0;padding:0;">Feld 3</td>
</tr>
</table>
</div>
<div style="margin:0;padding:0;">
<table style="margin:0;padding:0;">
<tr style="margin:0;padding:0;">
<td style="border:1px solid;margin:0;padding:0;">Okay hier soll der Text hin.</td>
</tr>
</table>
</div>
flapo
Neues Mitglied
Wo meinst du?
[css]display[/css]
Display legt fest, wie ein Element angezeigt werden soll. Mit block ist es ein Block-Element
Die Lösung heisst border-collapse:collapse ([css]border-collapse[/css])
Das musst du nur unter <table> definieren.
Zuletzt bearbeitet:
A
Alti
Guest
Weil der dritte nicht gefloatet bzw. gecleared ist.
- Status