23. 티스토리 스킨 만들기 본문 태그, 트랙백

이번에는 본문 하단에 있는 태그와 트랙백 부분을 수정해보겠습니다.

간단한 수정만 할거니 대충 보셔도 됍니다.

먼저 HTML을 보시죠.

        <s_tag_label>

        <div class="tagTrail">

          <span class="tagText">TAG </span> [ ##_tag_label_rep_##]

        </div> 

        </s_tag_label>

        

        <div class="actionTrail">

          <a href="#tb" onclick="[ ##_article_rep_tb_link_##]">

            <s_tb_count> 

            트랙백 <span class="cnt">[ ##_article_rep_tb_cnt_##]</span>개

            </s_tb_count>

          </a>

, 

          <a href="#rp" onclick="[ ##_article_rep_rp_link_##]">

            <s_rp_count>

            댓글 <span class="cnt">[ ##_article_rep_rp_cnt_##]</span>개가 달렸습니다.

            </s_rp_count>

          </a>

        </div>

        <s_tb>

        <div class="trackback">

          <h3>Trackback Address :: [ ##_tb_address_##]</h3>

          <s_tb_container>

          <ol>

            <s_tb_rep>

            <li id="[ ##_tb_rep_id_##]">

              <h4>Subject: <a href="[ ##_tb_rep_url_##]" onclick="window.open(this.href); return false" rel="external nofollow">[ ##_tb_rep_title_##]</a></h4>

              <span class="from">Tracked from <span class="name"> [ ##_tb_rep_site_##] </span> </span>

              <span class="date">[ ##_tb_rep_date_##]</span>

              <a href="#" onclick="[ ##_tb_rep_onclick_delete_##]; return false" class="delete">&nbsp;<span>삭제</span></a>

              <p>[ ##_tb_rep_desc_##]</p>

            </li>

            </s_tb_rep>

          </ol>

          </s_tb_container>

        </div>

        </s_tb>

오늘 수정할 부분만 떼어 왔습니다.

.tagTrail, .actionTrail, .trackback 세가지의 클래스를 사용합니다.

그냥 태그 영역과 트랙백, 댓글이 몇개 달렸습니다라고 나오는 부분과 트랙백 부분입니다.

댓글 부분은 방명록처럼 수정하는 부분이 많으니 따로 하겠습니다.

.tagTrail {font-size:14px;margin:5px 0 5px 0;}

.tagTrail a {font-size:14px;color:#08C;}

.actionTrail {font-size:14px;margin:5px 0 5px 0;}

.actionTrail a {font-size:14px;color:#08C;text-decoration:none;}

.actionTrail a:hover {color:#000;}

.trackback {font-size:14px;margin:5px 0 5px 0;}

.trackback a {font-size:14px;color:#08C;text-decoration:none;}

많이 수정한건 없구요.

전체적으로 font-size, margin, color 정도만 수정했네요.

자세한 설명은 따로 필요없겠죠?

저는 이 #0088CC란 색이 마음에 드는 것 같아요 ㅋ

링크는 전부 저 색으로 바꿔주고 있네요.

오늘은 간단한 것만 수정했기 때문에 크게 어렵진 않으실꺼에요~!