목록div (2)
키스세븐
[div 겹침 문제 해결 방법 - DIV의 float 사용 문제라면 clear로 해결] 90년대와 2천년대에는 사이트 디자인을 거의 테이블로 했지만, 최근의 홈페이지는 반응형도 염두에 두어야 하고 속도 문제도 있기 때문에 테이블 구조로 짜는 경우가 거의 없습니다. 그래서 최근의 사이트는 대부분 DIV로 디자인 배치가 작성됩니다. 그러다보면 div 겹침 문제가 일어나서 골치가 아픈 경우가 있습니다. Div 겹침 문제 예제 Float 속성 div는 기본적으로 좌우 100%의 너비를 가지고 있고 div를 추가하면 자동으로 아래쪽으로 길이가 길어지게 됩니다. 그 중의 한 가지 문제는, 이것을 옆으로 배치하거나 할 때 float를 사용해서 배치를 하게 되는데, 이 경우에 div 겹침 문제가 종종 발생합니다. 이럴..
[DIV의 투명도 효과 조절 - opacity (브라우저 버전에 따른 CSS적용)] 인터넷 사이트를 다니다 보면 글자가 반투명이라 글자 뒤의 사진이 글자에 비치는 효과를 낸 것을 볼 수가 있습니다. 이건 어떻게 하는 것일까요? 사진에 바로 포토샵으로 글자를 쓴 것이라면 레이어의 투명도를 조절해서 넣은 것이겠지만, 회원이 올린 사진에 자동으로 글자 반투명 효과가 적용되는 것은 어떻게 하는 것일까요? 아래 내용은 세가지 문제점에 대한 설명입니다. 첫째, DIV를 투명하게 또는 반투명하게 할 수 있는가? 둘째, DIV 내부의 DIV까지 투명 지정에 영향을 받는 것을 어떻게 해결할 것인가? 세째, 브라우저마다 지원을 하는 것도 안하는 것도 있는데 어떻게 해결할 것인가? DIV의 투명도 조절에 대한 기본 opac..