구글 블로그 코드 이쁘게 삽입하는 방법

구글 블로그에서 코드를 이쁘게 삽입하는 방법은 다양하게 있지만 그 중 제가 가장 마음에 든 방법을 소개합니다.
https://colorscripter.com/ 접속합니다.

해당되는 언어를 선택하신 후 세부설정을 클릭합니다.

HTML태그 자체 복사를 클릭해줍니다.

우측 하단에 있는 클립보드에 복사 버튼을 클릭합니다.

HTML 코드를 복사한 뒤 구글 블로그 글쓰기에서 HTML을 클릭해서 HTML 코드를 삽입해줍니다.

미리보기를 클릭하셔서 확인하시면 코드가 이쁘게 삽입된걸 확인 하실 수 있습니다. 그런데 이건 제 취향이지만 저는 가로폭이 전부 코드로 보였으면 더 이쁠거 같다는 생각을 했습니다.

td의 width 속성을 100%로 설정해주면 됩니다. ctrl + f 키를 눌러서 td를 입력해줍니다.
td가 2개가 있는데 첫번째 영역은 1,2,3,4,5 등의 숫자 영역이고 두번째 영역이 코드 영역입니다. 두번째 영역을 수정해줍니다. 주의하실 점은 padding 앞이든 뒤든 상관없지만 속성을 구분하기 위해 ; 세미콜론을 꼭 입력해주셔야 합니다.

1

<td style="width:100%;padding:6px 0">

cs

제 스타일에 맞는 이쁜 코드가 완성되었습니다.