Tabellenecken abrunden?!

Status
Nicht offen für weitere Antworten.
iLu_is_a_loser

iLu_is_a_loser

Erfahrenes Mitglied
Hallo kann man mit HTML oder wenn möglich auch mit CSS die Ecken einer Tabelle abrunden? So das ein kleiner Radius in den Ecken is....

Oder kann man das anhand von Grafiken realiesieren, wenn ja bitte wie?

greetz iLu
 
ja erstmal danke...

bloß dieses "Tutorial" hat mir ned richtig geholfen...hat jemadn vielleicht sowas auch in deutsch (oder anders erklärt) oder kann mir das auch jemand so sagen?


gruß
 
Schau dir halt den Quellcode an!
Ansonsten machst du es halt mir Grafiken und in jede Ecke eben eine Grafik rein.
 
Aus dem Quellcode kann ich nichts entnehmen... ich wollt wohl gern irgendwie ne kleine Erklärung dazu...

Und mit Graiken wollt ich das nicht machen wnen es auch so geht....

gruß
 
hey,

also, ich habe mir das jetzt mal angesehen und dir ein wenig auseinander genommen.
Hier mal der Code:

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
 	"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
 <head>
 <style type="text/css">
 
 #xsnazzy p {margin:0 10px; letter-spacing:1px;}
 #xsnazzy {background: transparent;}
 
 .xtop, .xbottom {display:block; background:transparent; font-size:1px;}
  .xb1, .xb2, .xb3, .xb4 {display:block; overflow:hidden;}
  .xb1, .xb2, .xb3 {height:1px;}
  .xb2, .xb3, .xb4 {background:#eca; border-left:1px solid #fff; border-right:1px solid #fff;}
  .xb1 {margin:0 5px; background:#fff;}
  .xb2 {margin:0 3px; border-width:0 2px;}
  .xb3 {margin:0 2px;}
  .xb4 {height:2px; margin:0 1px;}
  
 .xboxcontent {display:block;  background:#eca; border:0 solid #fff; border-width:0 1px;}
 
 #info {background:#ddd; padding:2em;}
 
 </style>
 </head>
 
 <body>
 
 
 <div id="info">
 
 
 <div id="xsnazzy">
 
<b class="xtop"><b class="xb1"></b><b class="xb2"></b><b class="xb3"></b><b class="xb4"></b></b>
 
 <div class="xboxcontent">
 
 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh
   euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim
   ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl
   ut aliquip ex ea commodo consequat.</p>
 
 </div>
 
<b class="xbottom"><b class="xb4"></b><b class="xb3"></b><b class="xb2"></b><b class="xb1"></b></b>
 
 </div>
 
  </div>
 
 
 
 </body>
 </html>

Ich denke die Rot markierten Bereiche sind das auschlaggebende.
Aber ehrlich gesagt so richtig durchgestiegen wie das jetzt funktioniert bin ich grad auch noch nicht, hab jetzt auch nicht viel Zeit.


gruß
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück