Archivlink: javarea.de Forum > (X)HTML & CSS (allgemein) > Tabellenfeld als link
Vollständigen Link anzeigen: javarea.de Forum > (X)HTML & CSS (allgemein) > Tabellenfeld als link

Pages: [1] 2 ... nächste » ... Letzte »

geschrieben von pdqbach am 26.06.2005 - 23:59
Hallo,

ist es moeglich, ohne Hintergrundbild ein Tabellenfaeld unabhängig vom Inhalt als Link zu setzen?
Etwa:
<table>
<tr>
<a href = "link.de">
<td>
KLICK
</td>
</a>
</tr>
</table>

So klappt es jedenfalls nicht!
Danke und Gruss
Peter

geschrieben von Micha am 27.06.2005 - 00:07
Wenn Du den Link als Blockelement mit CSS definierst, könntest Du ihn größenangaben geben - siehe Display.

Du musst aber trotzdem
HTML-Quelltext
1: 
<tr> <td> <a class="blockelement">Klick</a></td> [...] </tr>

definieren...

Micha

geschrieben von okley am 27.06.2005 - 09:31
für was willst du es machen? als menu? dann gäbe es bessere varianten. ansonsten kannst du auch auf javascript zurückgreifen, es geht aber auch ohne, und ist ohnehin noch barrierefrei.

geschrieben von sobi am 27.06.2005 - 09:51
HTML-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: 
#menuebar a {
  display: block;
  color: #171717;
  background-color: #00CBA9;
  text-decoration: none;
  font-family: 'Comic Sans MS', verdana, arial, sans-serif;
  font-size: 10pt;
  width: 117px;
  padding-left: 8px;
}

#menuebar a:visited {
  color: #171717;
  background-color: #00CBA9;
  text-decoration: none;
  font-family: 'Comic Sans MS', verdana, arial, sans-serif;
  font-size: 10pt;
  width: 117px;
  padding-left: 8px;
}

#menuebar a:active {
  color: #171717;
  background-color: #00CBA9;
  text-decoration: none;
  font-family: 'Comic Sans MS', verdana, arial, sans-serif;
  font-size: 10pt;
  width: 117px;
  padding-left: 8px;
}

#menuebar a:hover {
  color: #FFFFFF;
  background-color: #007B79;
  text-decoration: none;
  font-family: 'Comic Sans MS', verdana, arial, sans-serif;
  font-size: 10pt;
  width: 117px;
  padding-left: 8px;
}


HTML-Quelltext
1: 
2: 
3: 
4: 
5: 
6: 
7: 
8: 
9: 
<table width="600" border="0" align="center" cellpadding="0" id="menuebar">
<tr>
  <td><a href="./format_format_values.php" target="mainframe" title="Counterstände & Link Hits auflisten">Anzeige</a></td>
  <td><a href="./printer_module.php" target="_top" title="Druckbare Ansicht erzeugen">Drucken</a></td>
  <td><a href="./format_help.php" target="mainframe" title="Counterstände verwalten">Bearbeiten</a></td>
  <td><a href="./edit_edit_links.php" target="mainframe" title="Steuerdatei für Links anlegen und editieren">Editieren</a></td>
  <td><a href="./format_help.php" target="mainframe" title="Hinweise zum Gebrauch">Hilfe</a></td>
</tr>
</table>


So läuft es bei mir. Wenn Du die Breite der Links nicht definierst klappt's nicht. Ich hab' auch Probleme gehabt, wenn nicht für jeden Link (a: visited active hover) eine eigene CSS Definition existiert. Die Links musst Du auf Deine Bedürfnisse ändern. Wenn nichts drin stehen soll, gib ein geschütztes Leerzeichen ein. Wichtig ist die ID und dass es eine eigene TABLE ist. Am Aussehen kannst Du "basteln"

geschrieben von okley am 27.06.2005 - 10:29
ich denke menus sollten besser mit diesen techniken umgesetzt werden:
http://css.maxdesign.com.au/

das ist übersichtlicher, flexibler, einfacher zu verwalten/automatisieren

geschrieben von René am 27.06.2005 - 10:38
@Uli

das ist genau bzw. macht das gleiche wie deine 3 Meter CSS-Code.

HTML-Quelltext
1: 
2: 
3: 
4: 
5: 
6: 
7: 
8: 
9: 
10: 
11: 
12: 
13: 
14: 
15: 
16: 
17: 
#menuebar a
{
	font-family: 'Comic Sans MS', Verdana, Arial, sans-serif;
	background-color: #00cba9;
	text-decoration: none;
	padding-left: 8px;
	font-size: 10pt;
	display: block;
	color: #171717;
	width: 117px;
}

#menuebar a:hover
{
	background-color: #007b79;
	color: #fff;
}

geschrieben von sobi am 27.06.2005 - 12:32
Zitat
  Original geschrieben von René am 27.06.2005 - 10:38 [b]
@Uli
das ist genau bzw. macht das gleiche wie deine 3 Meter CSS-Code.
Wenn ich das mache und noch weitere Links mit anderen Formatierungen im selben Dokument habe gibt's bei mir Fehler. Hab' ich stundenlang ausgetestet. Deshalb schreib ich ja 3 Meter und den Zusatz unten drunter. Bin ich Sekretärin, macht mir Schreiben Spass, werd' ich nach Länge bezahlt ???

@pdqbach:: Wenn Du also Macken bei anderen Link Formatierungen bekommst, denk an mich

geschrieben von pdqbach am 27.06.2005 - 12:51
Hallo zusammen,

danke Sobi und Rene, es funktionieren bei mir tatsaechlich beide Varianten genau gleich.

Die Idee mit den .gifs hat zwei Haken:
- Du musst schöne gifs mit viel Aufwand in einem Graphikprogramm herstellen
- Ich denke bei einem Menue mit 4 Punkten an die armen Modembenutzer:
4 x 3KB macht 12KB, also 4 Sekunden warten auf eine zentrale Seite, das finde ich zu lang!

Peter

geschrieben von okley am 27.06.2005 - 13:01
@pdqbach, welche gifs meinst du? in einem menu wirst du kaum ein gif haben grösse als 3KB. meine menugifs haben maximal 2KB. die aufzählungszeichen sind 0.06KB gross

geschrieben von pdqbach am 27.06.2005 - 13:26
#okley, hatte ein gif von Deinem Beispiel gespeichert, da waren es 3KB.
Das Problem gibt es natuerlich nur, wenn es (wie vorgerechnet) 4 oder mehr werden.

#sobi, noch ein Problem:
Im Mozilla baut er Deine Tabelle richtig, mit 5 Feldern nebeneinander.

Im IE aber untereinander, und das bekomme ich auch nicht geaendert!
Any idea??

Peter

geschrieben von sobi am 27.06.2005 - 14:40
Zitat
  Original geschrieben von pdqbach am 27.06.2005 - 13:26
#sobi, noch ein Problem:
Im Mozilla baut er Deine Tabelle richtig, mit 5 Feldern nebeneinander.

Im IE aber untereinander, und das bekomme ich auch nicht geaendert!
Any idea??
Ja. Oben im Code sind zwei rote Änderungen <tr>...</tr>, damit sollte das gehen. Du könntest freundlicherweise mal diesen Link DEMO probieren und mir sagen, ob dann die Tabelle bei Dir auch untereinander kommt. Dann hätte ich nämlich eine Macke drin die mir meine Browser nicht anzeigen.

Dass der Dreizeiler von Rene läuft weiss ich. Bloss wenn Du in der Seite noch andere "normale" Links benutzt, dürftest Du wegen dem display:block; und der background-color; Probleme bekommen. Je nach Formatierung fallen die möglicherweise erst später auf. In der Regel wird, wenn Du nicht explizit jeden Link mit CSS formatierst, die BLOCK Anweisung und der BACKGROUND in anderen Links mit- und falsch ausgeführt (jedenfalls im IE). Ich habe auch Probleme bekommen, wenn ich mit einer CLASS anstatt einer ID formatiert habe. Vielleicht gönnst Du Dir ja die 3 METER CSS und sparst Dir lange Fehlersuche. Hab ich damit nämlich schon hinter mir.

geschrieben von pdqbach am 27.06.2005 - 14:47
HI,

bin jetzt soweit gekommen:

<html><head>
<title>Music for Oboe</title>

<style type="text/css"> -->
<!--
#menuebar a:link, a:visited, a:active {
font-family: Verdana, Helv, Arial, sans-serif;
background-color: #EEEEEE;
text-decoration: none;
display: block;
padding: 20px;
color: #000000;
width: 300px;
height: 60px
}

#menuebar a:hover {
background-color: #DDDDDD;
}
.b1 { font-family: Verdana, Arial, Helvetica, Geneva, sans-serif;
font-size:18pt; font-weight:700; }
.t { font-family: Verdana, Arial, Helvetica, Geneva, sans-serif;
font-size:9pt; }
-->
</style>

</head>


<body
<table width="100%" border="0" align="center" cellpadding="0" id="menuebar">
<tr>
<td align="right">
<a href="./bassearch.pl?sid=$sid">
<font class="b1">Basic Search</font>
<br><br>
<font class="t">search by composer and/or instrumentation</font>
</a>
</td>
<td align="left">
<a href="./">
<font class="b1">Advanced Search</font>
<br><br>
<font class="t">search for many different criteria</font>
</a>
</td>
</tr>
<tr>
<td align="right">
<a href="./">
<font class="b1">Pieces</font>
<br><br>
<font class="t">with additional comments</font>
</a>
</td>
<td align="left">
<a href="./">
<font class="b1">New Pieces</font>
<br><br>
<font class="t">not listed in the printed version</font>
</a>
</td>
</tr>
</table>
</body></html>

Ist in Mozilla genauso wie ich es will, im IE sind die 4 Felder untereinander und mir faellt nichts mehr ein, wie man das aendern koennte.
Peter

geschrieben von pdqbach am 27.06.2005 - 14:49
# sobi, hatte schon geschrieben waehrend deine Antwort eintraf..

<tr> hatte ich schon ergaenzt, dass war es nicht.

geschrieben von pdqbach am 27.06.2005 - 14:57
Zitat
  Du könntest freundlicherweise mal diesen Link DEMO probieren und mir sagen, ob dann die Tabelle bei Dir auch untereinander kommt. Dann hätte ich nämlich eine Macke drin die mir meine Browser nicht anzeigen.


Nein, es klappt (und sieht gut aus!)

Peter

geschrieben von sobi am 27.06.2005 - 14:57
Hast Du mal meinen Link DEMO aus der letzten Nachricht probiert ??? Tu's mal bitte. Da läuft die Routine nämlich LIVE. Die Formatierung
HTML-Quelltext
1: 
#menuebar a:link, a:visited, a:active
in einer CSS Anweisung wird Dir mit Sicherheit Probleme machen. Ich Check Deinen Code jetzt mal.

cu
Uli


Powered by: JBB v.2.0.4 Copyright ©2000-2006, www.javarea.de.