반응형
CSS3 border-radius (2) |
[두 곳만 둥글게 15px / 25px 표시한 이미지]
<!doctype html> <html> <head> <meta charset="utf-8"> <title>무제 문서</title> </head> <style> div.rounded { background-color: #666; color: #fff; line-height: 20px; width: 350px; height: 50px; padding: 10px; border: thin double #C90; -webkit-border-bottom-left-radius:15px; -moz-border-radius-bottomleft:15px; -webkit-border-top-right-radius: 25px; -moz-border-radius-topright:25px; } </style> <body> <div class="rounded"> HTML5 + CSS3 공부를 열심히 합시다<BR> 왼쪽 아래 모서리 15 픽셀만큼 둥글게 합니다. <br> 오른쪽 아래 모서리 25 픽셀만큼 둥글게 합니다. </div> </body> </html> |
반응형
'웹개발 > HTML' 카테고리의 다른 글
| #CSS3 Text-Shadow (0) | 2014.07.16 |
|---|---|
| #CSS3 Border-radius 로 원 그리기 (0) | 2014.07.15 |
| #CSS3 border-radius (0) | 2014.07.15 |
| #CSS3 Property (0) | 2014.07.15 |
| Devloper Android, Eclipse (0) | 2014.07.14 |