HTML - 줄바꿈 들여쓰기 (hanging indentation)

1절 : 동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리 나라 만세 무궁화 삼천리 화려강사 대한사람 대한으로 길이 보전하세
2절 :  남산 위에 저 소나무 철갑을 두른 듯 바람서리 불변함은 우리 기상일세 무궁화 삼천리 화려강산 대한사람 대한으로 길이 보전하세
3절 : 가을 하늘 공활한데 높고 구름 없이 밝은 달은 우리 가슴 일편 단심일세 무궁화 삼천리 화려강산 대한사람 대한으로 길이 보전하세
4절 : 이 기상과 이 맘으로 충성을 다 하여 괴로우나 즐거우나 나라 사랑하세 무궁화 삼천리 화려강산 대한사람 대한으로 길이 보전하세

위와 같이 애국가 가사를 1절, 2절, 3절, 4절 나누어  html 로 표현해야 할 때, 줄바꿈 들여쓰기가 되어 있지 않으면 보기가 좋지 않다. 아래와 같이 줄바꿈 들여쓰기가 되어 있다면 보기가 편안해진다.

1절 : 동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리 나라 만세 무궁화 삼천리 화려강사 대한사람 대한으로 길이 보전하세

2절 : 남산 위에 저 소나무 철갑을 두른 듯 바람서리 불변함은 우리 기상일세 무궁화 삼천리 화려강사 대한사람 대한으로 길이 보전하세

3절 : 가을 하늘 공활한데 높고 구름 없이 밝은 달은 우리 가슴 일편 단심일세 무궁화 삼천리 화려강사 대한사람 대한으로 길이 보전하세

4절 : 이 기상과 이 맘으로 충성을 다 하여 괴로우나 즐거우나 나라 사랑하세 무궁화 삼천리 화려강사 대한사람 대한으로 길이 보전하세

이렇게 줄바꿈 들여쓰기(hanging indentation) 을 하려면 태그의 style 에 다음을 추가해 주면 된다.

style="padding-left: 40px; text-indent: -40px;" 

이때, 40px 부분은 상황에 맞게 적절히 조절해 주면 된다.