영어 단어 강제 줄바꿈시 자동 하이픈 shy 태그

11월은 제작 물량이 엄청 밀려서 정신이 없었네요.

어제 새벽 작업을 끝으로, 들어온 모든 작업 마무리를 하고 이제 숨좀 돌리게 됐습니다.

​

너무 오래 글을 올리지 못해서 ㅜ.ㅜ

숨 돌리자 마자 바로 팁 하나 올립니다.

​

오늘 소개할건 shy

​

말 그대로 부끄러워 하는 코드예요.

뭔 소리인고 하니,

​

마침 이런 샘플이 딱 걸리네요.

사실 이 책 편집하다 생각나서 글을 올리는 것이지요.

​

이런 경험 많이 해 보셨을거예요.

한번도 경험 없다면, 제작을 별로 안해본 분일테고요.

​

이걸 해결하기 위해 많은 분들이

​

word-break : break-all;

​

이 스타일을 추천할거예요.

그런데 이 스타일에는 문제가 하나 있습니다.

​

이 책에 PidginConversation 이런 단어가 있어요.

띄어쓰기 잘못한거 아닙니다. 단어가 저렇게 들어있어요.

word-break 스타일을 적용하면 저 단어가

​

Pidgin

Conversation

​

이렇게 되거나,

​

Pidg

inConversation

​

이렇게 되거나

​

PidginConver

sation

이렇게 됩니다.

의미가 완전히 달라져요.

​

이럴 때 영어권에서는 하이픈을 사용합니다. 잘리는 단어 뒤에 하이픈을 붙여서 두 단어가 연결됐다고 표시를 합니다.

​

Pidgin-

Conversation

​

이러면 줄바꿈이 되어 단어가 잘려도 Pidgin와 Conversation는 하나라는 뜻입니다.

​

그렇지만 줄바꿈을 위해 Pidgin-Conversation 이렇게 넣을 수는 없잖아요.

줄바꿈이 없으면 PidginConversation 이렇게, 줄바꿈이 되면 Pidgin-Conversation 이렇게 넣을 방법이 없을까요?

​

이때 필요한게 shy입니다.

shy는 줄바꿈이 없을 때는 부끄럼쟁이처럼 숨어있습니다. 말 그대로 shy예요.

하지만 줄바꿈이 생기면 잘린 부분에 표시가 되지요.

빨간색 하일라이트 부분 보이세요?

저 하이픈이 shy 코드입니다.

​

update_typing_icon 같은 다른 단어에도 shy 코드가 들어있지만, 줄바꿈 된 단어(영어 단어가 아닌거 아시지요?)에서만 shy가 표시됩니다.

​

뷰어 특성에 따라 shy가 지원되지 않을 수 있어요.

다 지원은 하지 않지만, 그래도 지원하는 뷰어는 더 잘 보이게 만들고 싶다면 넣어주세요.

word-break와 shy를 같이 사용하면 됩니다. 그냥 shy만 넣어도 강제 줄바꿈 해 주는 뷰어가 있는데, 그렇지 않은 뷰어도 있으니 word-break를 같이 쓰는게 좋아요.

​

shy가 뭔지, 어떻게 넣는지, word-break가 뭔지는 공부하시라고 설명 생락^^

​

그리고 sigil에서 코드 정리 하면 shy가 사라진다고 하는 분들이 있는데,

이 역시 sigil 공부를 하면 해결됩니다. 역시 설명 생략~