예쁜 제목줄 만들기

pardonk님께서 예쁜 제목줄을 붙이는 방법에 대해 물으셨다.

그나저나 궁금한게 글 쓸 때 소제목처럼 처리하는건 어떻게 하는 건가요? 그냥 구분선도 아닌 것이 신기하네요.

이 제목줄 말이다... 예쁘지 않은가?

이 제목줄은 다음에서 처음 사용되었고, 이후 페니웨이 님께서 사용하시는 것을 보고 나도 사용하게 된 것이다.
표(table) 태그를 사용해서 만든 것인데, 간단한 코드지만, 깔끔하고 예쁘다.

파란색 제목줄은 HTML모드에서 아래와 같은 코드를 집어넣으면 사용할 수 있다.

<table style="width: 100%; border-collapse: collapse; height: 31px;" cellpadding="1" cellspacing="1">
<tbody><tr style="border-style: solid; border-color: rgb(48, 88, 210); border-width: 0px 0px 1px;">
<td width="1%" bgcolor="#3058d2">&nbsp;</td>
<td width="99%">&nbsp;&nbsp;<span style="font-size: 10pt; font-family: Gulim; color: rgb(0, 51, 102); font-weight: bold;">파란색 제목줄</span></td>
</tr></tbody></table>

파란색 제목줄

그리고, 제목줄을 빨간색으로 사용하고 싶으면 아래의 코드를 사용하면 된다.

<table style="width: 100%; border-collapse: collapse; height: 31px;" cellpadding="1" cellspacing="1">
<tbody><tr style="border-style: solid; border-color: rgb(210, 88, 48); border-width: 0px 0px 1px;">
<td width="1%" bgcolor="#d25830">&nbsp;</td>
<td width="99%">&nbsp;&nbsp;<span style="font-size: 10pt; font-family: Gulim; color: rgb(102, 51, 0); font-weight: bold;">빨간색 제목줄</span></td>
</tr></tbody></table>

빨간색 제목줄

참 쉽죠~잉?

덧. 원래 코드는 이것보다 좀 더 길었다.
아마도 WYSIWYG 도구로 만든 것 같은데, 너무 지저분한 코드들이 많아서 필요한 부분만 남기고 정리했다.