[CSS 스타일 샘플] 구역 나누기??

이런 스타일을 뭐라고 이름 붙일지 모르겠네요.

종이책(왼쪽)에서는 왼쪽으로 페이지 세로에 꽉 차게 영역을 만든 후 본문의 제목이나 저자 설명 같은 부연설명을 넣었습니다.

다음 페이지는 왼쪽 박스 영역 없는, 배경색만 있는 페이지예요.

전자책은 페이지를 구분할 수 없기 때문에 저걸 한 페이지로 맞추려는 노력을 하기 보다는, 왼쪽 글상자를 만들고, 안에 내용을 채워 넣는게 좋아요.

오른쪽이 EPUB입니다.

 

이렇게 만들면 한가지 문제가 생깁니다.

휴대폰처럼 세로로 길면 캡처한 이미지 처럼 보입니다.

하지만 세로 폭이 좁은 화면에서는 왼쪽 글상자가 다음페이지로 넘어갈 수 있어요.

이건 그러려니 하고 넘어가야돼요.

이거 맞추겠다고 가로폭 늘리고 세로폭 줄이면, 더 좁은 화며에서 똑같은 문제가 생기고, 그러다 보면 가로로 넣어야 하거든요.

 

​

아예 EPUB용은 디자인을 바꿔 가로로 넣는 것도 좋습니다.

하지만, 디자인은 유지하면서 글상자가 다음 페이지로 넘어가면 안된다. 이런건 불가능하지요. 네모난 동그라미를 그려달라는 소리와 같아요.