정보실

웹학교

정보실

css CSS 화면을 다단으로 나누기

본문

CSS를 이용하여 화면을 다단편집할 수 있습니다..

 

CSS:

.three-col {

       -moz-column-count: 3;

       -moz-column-gap: 20px;

       -webkit-column-count: 3;

       -webkit-column-gap: 20px;

 

HTML:

<p class="three-col">장돌뱅이 허 생원은 친구 조 선달과 함께 다닌다. 허 생원은 얼금뱅이에 왼손잡이라 여자와는 거리가 멀었고, 나귀를 평생 벗삼아 살았다. 어느 여름날 허 생원은 봉평 장에서 장사를 마치고 주막 충줏집에서 술을 마시는데, 젊은 장돌뱅이 동이가 충줏집[2]과 농탕치는 것을 보고는 화가 치밀어 동이를 때린다. 그러나 동이는 허 생원의 나귀가 발정이 나 줄을 끊으려 하자, 이를 허 생원에게 알릴 정도로 착하다.

 

그날 달이 뜬 밤, 허 생원과 조 선달, 동이는 대화 장으로 이동하기 위해 산길을 걷는다. 길은 메밀꽃이 주위에 피어서 한 줄로 지나가야만 했기에, 조 선달이 허 생원을 앞세우고 동이는 뒤로 쳐져서 따라왔다. 허 생원은 젊었을 적에 처녀를 딱 하루 만났으나 다음 날 처녀의 가족이 제천으로 도망가 더 이상 만나지 못했다는 이야기를 조 선달에게 하지만, 동이는 이 이야기를 듣지 못한다. 고개를 넘자 길이 넓어진다. 동이는 봉평이 고향이며 제천에서 달이 채 차지 못한 자신을 낳고 쫓겨난 어머니, 매일같이 술만 마시는 의붓아버지의 이야기를 둘에게 한다. 이윽고 세 사람은 하천을 건너다가, 허 생원이 그만 물에 빠져 버린다. 동이가 허 생원을 업고 물을 다 건너고, 허 생원이 동이가 왼손에 채찍을 쥔 것을 보면서 소설은 끝난다.</p> 

 

미리보기:

https://365ok.co.kr/dn/css/multiple-columns.html

 

  • 트위터로 보내기
  • 페이스북으로 보내기
  • 구글플러스로 보내기
  • 카카오톡으로 보내기

페이지 정보

조회 245회 ]  작성일15-04-27 21:38
css

웹학교