[디자인]벨로그 포스팅 꾸미기

startingfindmistake·2025년 12월 12일

처음 벨로그를 접하면 마크다운 문법으로만 작성하다 보면
디자인이 그냥 칙칙해진다. 네가 작성한 포스트도 눈에 잘 안들어고
그래서 이것을 잘 보이기 위해 블로그를 꾸며보자

블로그 꾸미기의 첫 번째

바로 이미지로 들어가 보자
이모티콘을 올려보자 다양하게 올릴수 있다.

맥북에서는
control + command + spacebar를 누르면 이모티콘 팝업이 나온다.




그 다음의 트리 처럼 글자를 차례대로 공백을 넣어보자



 

Non-breaking Space로 줄 바꿈 없는 공백이란 뜻이다.
공백 1칸을 의미한다.


사용방법

<div>&nbsp;안녕하세요</div>

출력형식

 안녕하세요

위의 내용을 보면 포스트에서 한칸 뛰어진것을 볼수 있다.




&ensp;

공백 2칸을 의미한다.


사용방법

<div>&ensp;안녕하세요</div>

출력형식

 안녕하세요

위의 내용을 보면 포스트에서 두칸 뛰어진것을 볼수 있다.




&emsp;

공백 3칸을 의미한다.


사용방법

<div>&emsp;안녕하세요</div>

출력형식

 안녕하세요

위의 내용을 보면 포스트에서 두칸 뛰어진것을 볼수 있다.




전체를 한번에 보면


사용방법

<div>&nbsp;안녕하세요</div>
<div>&ensp;안녕하세요</div>
<div>&emsp;안녕하세요</div>

출력형식

 안녕하세요
 안녕하세요
 안녕하세요

이렇게 보면 차이가 난다.

이거의 단점은 한줄이 넘어가면 풀린다는것




아예 html 내용 자체를 출력하고 싶다면


사용방법

<pre>안녕하세요
굿모닝 입니다
		안녕하세요</pre>

출력형식

안녕하세요
굿모닝 입니다
		안녕하세요

profile
도움이되었다면 그것으로 충분 합니다.

0개의 댓글