수다닷컴

저도 배울땐 보통 라운드 박스는 가로나, 세로 어느 한쪽이 거의 고정이기 때문에
늘어나는 쪽으로 이미지를 늘려서 쓰고있어요^^

유동적인 이미지에서 center로 정렬은 한계가있죠

얼마나 늘어날지 모르니;

상단 top ,중간은 center ,하단은 bottom 뭐 이런식으로 하면 가능합니다.
전제는 역시 그라데이션이 없으면 입니다 ㅎㅎ

제 생각에.... 세로만 유동 적이어도 이미지 두개 필요 하지 않을까요??
위의 라운드와 아래 라운드....
이미지 하나로,,,,,,,음-
아무리 머리 굴려봐도 이미지 하나로는......
제 머리가 부족 하네요.....;;

이미지 한개로 세로 유동표현이 가능한가여, 신기하네여 헐...

세로 유동이고 저정도면 색상이랑 디자인이면 이미지 하나로도 충분하답니다.
(그라데이션이 없으니, 가로세로 유동이면 또 틀려지지만)

네귀퉁이 둥근부분만 이미지컷팅하고, 단면선은 border 로 입힌다는건가여?!
저 그거 시도해밨는데 익스6이 깨져서 포기했는데 나중에 시간되시면 코드공유 가능할가여..ㅠ

가변적이냐 아니냐에 따라 달라지지 않을까요.
저는 디자이너와 상의해서 박스 타입의 기능과 형태를 정의해서 좀 제한적으로 쓰게 만든 다음에..
가변적이지 않은 bg의 경우 그냥 통으로 bg로 넣고,
가로폭 고정일 경우 높이만 통으로 bg로 쓴 후 bottom만 따로 태그를 넣어서 표현하거나..
혹은 가로새로 모두 가변적일 경우 라운딩 부분 잘라서 원형으로 넣어서 네 귀퉁이를 표헌하고 귀퉁이가 포함된 엘리먼트에 보더와 bg를 넣어서 코딩합니다.

쪽지 확인해주세요^^;

psd 쭉 미리보기해보고 같은 디자인인데 가로랑 세로가 가변적인 라운드면
왼쪽위, 오른쪽 위, 왼쪽아래, 오른쪽 아래등.. 4개로 잘라내는데 왼쪽이든 오른쪽이든,
한곳은 좀 무쟈게 길게 잘라서(포토샵작업 필요), 부모나 라운드 안의 자식 css 에서 가로길이만 입력하면
알아서 늘어나게 되는 기법을 사용하죠~

그렇지않다면야 보통은 2~3단으로 합니다. 한 태그에 백그라운드이미지는 1개만 가능하니,
너무 조각내면 태그의 중첩이 심해지므로.. 가로길이만