[phpschool 펌] css로 겔러리 리스팅하기

글쓴이:거친마루

css로 겔러리 리스팅하기

조회수:771

http://x.debugs.co.kr/testcode/css_gallery.htm 게시판을 새로 짜다가 겔러리를 따로 만들어야 하나.. 곰곰히 고민하다가 재미난 생각을 했습니다. 막강한 css를 이용해서 겔러리처럼 적당한 갯수로 끊어 보이도록 하는겁니다. <style> div.item { border: 1px solid #8cacbb; width: 21%; min-width: 14em; margin: 0px 0px 8px 2%; padding: 0px; float: left; } </style> 비밀은 float: left 와, width: 21% 인데요.. 왼쪽에서부터 레이어가 흐르도록 하고, 4개를 더해서 100%가 조금 안되게 비율을 적당히 조절하면.. 5개째 자동으로 다음 라인으로 넘어가게 됩니다. 디자이너와 함께 일하다보면.. css만으로 표현하기 애매한 도트라인이나 그라데이션이 들어가게 될경우 사용하기는 좀 힘들것도 같은데 일반적인 겔러리 뷰를 표시할적에는, 몇개씩 끊어 표시하는 로직을 php에서 따로 만들지 않아도 되지 않을까 하는 생각에서 올려봅니다 : )