html에서 띄어쓰기 하기, css로 들여쓰기 하기

🍚 html에서 띄어쓰기 하기

html로 띄어쓰기를 하면

• html 코드내에서 스페이스와 엔터를 아무리 추가하여도, 실제 결과 화면에서는 하나의 스페이스밖에 적용적용이 되지 않습니다.

👉 예시

💻 html

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

👀 결과

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

& nbsp;

• & nbsp; 를 사용하면 html에서 여러번의 띄어쓰기 효과를 줄 수 있댜.

👉 예시

💻 html

<p>    
  동해물과 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;백두산이 &nbsp;마르고 닳도록<br>   
  하느&nbsp;님이 보우하사 우리나라 만세<br>   
  무궁화 &nbsp;&nbsp;&nbsp;&nbsp;삼천리 화려 강산<br>
대한 사람 대한으로 길&nbsp;이 보전하세
</p>

👀 결과

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

---

🍚 css로 들여쓰기 하기

• css에서 text-indent라는 property를 사용하여 css에서 들여쓰기 효과를 낼 수 있다.

👉 예시

💻 html

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

💻 css

p {
text-indent: 50px;
}

👀 결과