Slik lager du runde hjørner i Photoshop og med CSS

Runde hjørner i Photoshop

Det enkle er ofte det beste. Denne korte og rett-på-sak-videoen tar bare med det aller nødvendigste og er således en perfekt veiviser for hvordan man lager runde hjørner i Photoshop.

Her er stikkord for forløpet:

  1. Velg Rounded Rectangle Tool (rett under Type Tool).
  2. Sett ønsket radius (øverst)
  3. Merk ønsket område på bildet
  4. Path Selection Tool (svart pil)
  5. Klikk på bildet for å merke det
  6. Velg Subtract from Shape Area (nest øverste rad)
  7. Velg eventuelt en annen farge «utenfor» kantene og bildet.

 

Slik lager du runde hjørner med CSS

I CSS er det border-radius som lager runde hjørner. Her er to eksempler:

<div style="border-radius: 10px; background-color:pink;padding:20px">test runde hjørner</div>

test runde hjørner

 

<div style="border-radius: 30px; background-color:pink;padding:20px">test runde hjørner</div>

test runde hjørner

 

  • Her er en generator som lager runde hjørner
    border-radius.com
    La bare CSS3 være avkrysset. Merk at du kan velge forskjellig størrelse på buen i de forskjellige hjørnene.
  • Se flere eksempler på: w3schools.com

 

 

Tips fra en webredaktør

Slik videresender du med 301 permanent redirect • Joomla-tips • Slik lager du runde hjørner i Photoshop og med CSS • Slik bruker du nofollow-lenker • Photoshop-tips (videoer) • Slik lager du runder hjørner med CSS og i Photoshop • Slik kan du fjerne rynker i Photoshop •