앗? 몰랐는데 지운아빠님이 이런 요청을 하셨었네요?

지운아빠님이 직접 하시면 5분이상 안걸릴텐데요?

이건 오해십니다. ㅎㅎㅎ 예제 하나만 짜주시면 감사하겠습니다. 굽신굽신

에이.. 프로분께서 저같은 위크엔드 워리어 (주말짜집퍼) 한테 왜 이러십니까? ^^ 그냥 사각형 div 안에 삼각형 두개를 넣으시던가 아니면 윗쪽은 비우고 삼각형 하나만 넣으시던가 하시면 되는건데...

지운아빠님 말고 다른분들을 위해서:

사각형은 자동으로 만들어지는거고 (width+height) 삼각형은 모르시는 분들이 좀 계실 것 같네요. 근데 삼각형도 아주 간단합니다. 예제라고 할만한 것도 아닙니다.

#triangle {
width: 0;
height: 0;
border-left: 100px solid pink;
border-top: 50px solid transparent;
border-bottom: 50px solid transparent;
}

이렇게만 하믄 삼각형이 만들어 집니다. 이걸 약간만 응용하면 카카오톡에 보면 보이는 텍스트 풍선, 같은 것 도 만들수 있겠죠?

그리고 radial gradient 는 사람이 그걸 다 외워서 코딩하기는 현실적으로 힘들구요, css tool 들이 몇개 있는데, 저는 radial gradient 는 이런 툴 사용으로 해결합니다.

http://www.visualcsstools.com/

css 도 좀 하다보면 생각보다 꽤 재미있습니다. (중독증 조심)

http://css3.zxq.net/doraemon/doraemon_css3.html (이건 도라에몽)

헐.. css만으로 도라에몽을 그린겁니까? 멋지군요..