티스토리 블로그 글 작성할 때 표 색상 변경하는 방법

< 티스토리 블로그 표 색상 변경하기 >

티스토리 블로그를 운영하는 사람이라면 글을 작성할 때 표의 색상을 마음대로 변경하는 방법에 대해 궁금해한 적이 있을 것이다. 이번에는 티스토리 블로그에서 글을 작성할 때 표의 색상을 변경하는 방법에 대하여 알아보겠다.

순번	과일	가격	판매 장소	판매 시간	비고
1	바나나	6,000원/손	서울특별시	오후 6시~오후 9시
2	사과	1,500원/개	부산광역시	오후 2시~오후 4시

먼저 위와 같이 과일의 가격과 판매 장소, 판매 시간이 적힌 표가 있다고 하자. 표를 작성해 놓고 색상을 변경하려니 기본모드에서는 내가 원하는 셀만 선택하여 부분 색상 변경이 불가능하다.

< 티스토리 표 테마 변경 기능 >

그나마 있는 것이 표 테마 변경 기능인데 원하는 색상도 없을뿐더러 원하는 부분만 색상을 변경할 수가 없다. 한글, Excel, PPT 등 보편화된 문서 편집 프로그램에 비하면 정말 형편없는 수준이다.

< HTML 모드로 변경 >

표의 색상을 변경하기 위해서 우측 상단에 있는 '기본모드'라고 적혀있는 글자를 클릭한다. 그러면 드롭다운 메뉴가 나타나는데 HTML 편집 모드로 변경한다. HTML 편집 모드에서 다시 기본모드로 돌아오기 위해서는 다시 똑같은 곳을 클릭하고 '기본모드'를 클릭하면 된다.

< HTML 편집 모드 >

< 크롬 브라우저 검색 기능 >

< table이라고 적혀있는 부분에 음영이 칠해진 모습 >

HTML 편집 모드에서는 기본 모드에서 작성했던 내용들이 모두 HTML 형식으로 표기된다. 여러 용어가 있지만 표를 나타내는 단어는 table이다. 내용에서 table이라고 적혀있는 부분을 찾는다. Ctrl + F를 눌러 찾기 창에서 'table'이라고 입력하면 table에 해당하는 부분에 음영이 칠해지므로 쉽게 찾을 수 있다.

< bgcolor 속성 값 입력 >

<table>내용</table> : table(표)

<th>내용</th> : table head(표의 제목)

<tr>내용</tr> : table row(표의 가로 줄)

<td>내용</td> : table data(표의 내용)

<b>내용</b> : bold(굵은 글씨)

style="내용" : html 태그 요소를 꾸며주기 위한 속성

style="속성 값 1, 속성 값 2, bgcolor="#원하는 색상 코드 6자리"

 

표와 연관된 HTML 태그의 뜻은 위와 같다. 본인이 원하는 셀을 먼저 찾고, style 속성 값에 배경색을 지정하는 내용을 입력하면 된다. 위의 양식대로 색상 코드 6자리를 입력하면 표를 본인이 원하는 색상으로 변경할 수 있다.

< 표의 색상이 변경된 모습 >

필자는 판매 장소라는 내용이 적혀있는 셀의 색상을 변경하는 것이 목적이었고 이를 위해 HTML 편집 모드에서 해당 내용이 입력된 td 태그의 style 값에 bgcolor="#53a1d9"를 추가했다. 그리고 다시 기본모드로 전환한 결과 위와 같이 원하는 색상으로 바뀐 것을 볼 수 있다.

< HTML 색상표 >

HTML 색상표

본인이 원하는 색상의 코드가 무엇인지 궁금하다면 HTML 색상표가 있는 사이트에 접속하여 확인하면 된다. 꾸준히 글을 작성할 계획이라면 본인만의 대표 색상코드를 메모해 두는 것이 좋다.