epub 밑줄 긋기

전자책에서 단어나 문장에 밑줄을 긋는 방법은 여러가지가 있습니다.

하지만 밑줄을 긋기 전어, 어떤 밑줄을 그을 것인지부터 정확히 알아야 합니다.

많은 사람들이, 밑줄을 긋고 싶다고 얘기하지 어떤 밑줄을 긋고 시픈지는 얘기하지 않아요.

 

1. 그냥 밑줄

아무 설명 없이 '밑줄을 그리고 싶다'고 한다면, text-decoration을 사용하세요.

text-decoration은 밑줄을 그리는 속성입니다.

색상, 두께, 모양 등을 지정 할 수 있습니다.

 

2.  밑줄의 모양을 보다 유연하게 편집하고 싶다면 border-bottom을 사용하세요.

text-decoration은 한계가 있습니다. 글자와 여백 조절이 어렵고, 인라인 스타일의 밑줄만 그릴 수 있습니다.

 

전자책을 만들다 보면 가장 먼저 두 가지 형태의 밑줄을 고민하게 됩니다.

 

인라인 스타일의 밑줄은 줄이 바뀔 때 같이 줄이 바뀝니다.

 

일라인 스타일의 밑줄은

줄이 바뀔 때 같이 줄이 바뀝니다.

 

이러게 문장이나 문단의 줄이 바뀔 때 밑줄도 같이 행갈이를 하고 싶다면 인라인 속성의 태그로 밑줄을 그리면 됩니다.

본문 내에 특정 문장의 밑줄을 그을 때 적합합니다.

 

<p><span class="txt_underline">인라인 스타일의 밑줄은 줄이 바뀔 때 같이 줄이 바뀝니다.</span></p>

.txt_underline {

    border-bottom : 1px solid #000000;

}

 

블럭 스타일은 줄이 바뀌어도 블럭 하단에만 줄이 표시됩니다.

 

블럭 스타일은 줄이 바뀌어도

블럭 하단에만 줄이 표시됩니다.

 

이렇게 문장이 줄을 바꿔도 아래에만 밑줄을 그리고 싶다면 블럭 스타일의 밑줄을 사용합니다.

주로, 제목 하단에 밑줄을 그릴 때 사용합니다.

 

<p class="txt_underline">블럭 스타일은 줄이 바뀌어도 블럭 하단에만 줄이 표시됩니다.</p>

.txt_underline {

    border-bottom : 1px solid #000000;

}

 

3. 물결무늬나 연필, 크레파스로 그은 것 같은 밑줄은 background-image를 사용하세요.

이런 밑줄은 background-image를 사용하면 쉽게 그릴 수 있습니다.

형광펜 스타일도 있습니다. 이 역시 background-image를 이용해 그릴 수 있습니다.