kostenloser Webspace werbefrei: lima-city

Nur eine Ecke abrunden

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   browsergame-entwickler

   

   browsergame-entwickler hat kostenlosen Webspace.

   4:04, 1.9.2012

   Hallo,
   
   ich brauche mal hilfe, und zwar wie runde ich nur eine ecke ab?
   wie ich alle abrunde weiß ich aber nicht wie ich nur eine abrunde.

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. paddy-herrmy

   

   paddy-herrmy hat kostenlosen Webspace.

   5:02, 1.9.2012

   Wenn du mit border-radius (css3) arbeitest, gibte es folgende Möglichkeiten:
   
   Info:
   -moz-border-radius
   Gecko (Firefox)
   
   -khtml-border-radius
   Webkit (Safari x.x), KHTML (Konqueror x.x)
   
   -webkit-border-radius
   Webkit (Safari, Google Chrome, Chromium)
   
   border-radius
   CSS3
   
   
   Für Dich:
   

   border-radius-bottomleft:20px;       
   -moz-border-radius-bottomleft:20px ;
   -khtml-border-radius-bottomleft:20px ;
   -webkit-border-radius-bottomleft:20px ;

   
   
   Hier wird nur die untere linke ecke abgerundet.
   Hoffe ich habe geholfen :-)
   
   Gruss Paddy
   
   
   Beitrag zuletzt geändert: 1.9.2012 8:04:38 von paddy-herrmy

4. pcw

   pcw hat kostenlosen Webspace.

   7:35, 1.9.2012

   Am einfachsten ist es natürlich das ganze shorthand zu schreiben.
   Angefangen von oben links im Uhrzeigersinn.
   
   Also um die obere rechte Ecke abzurunden:
   
   

   border-radius: 0 20px 0 0;

   
   
   
   
   
   

   paddy-herrmy schrieb:
   
   

   border-radius-bottomleft:20px;       
   border-radius-bottomright:20px ;
   -moz-border-radius-bottomleft:20px ;
   -moz-border-radius-bottomright:20px  ;
   -khtml-border-radius-bottomleft:20px ;
   -khtml-border-radius-bottomright:20px;
   -webkit-border-radius-bottomleft:20px ;
   -webkit-border-radius-bottomright:20px;

   
   
   Hier wird nur die untere rechte ecke abgerundet.
   
   Gruss Paddy
   

   
   
   ähm ... nicht ganz ... es werden beide untere Ecken abgerundet.

5. paddy-herrmy

   

   paddy-herrmy hat kostenlosen Webspace.

   8:04, 1.9.2012

   pcw schrieb:
   
   ähm ... nicht ganz ... es werden beide untere Ecken abgerundet.

   
   
   Hast natürlich völlig recht :-)
   Hab den Fehler ausgemerzelt^^

6. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?