CSS 코드를 작성하는 방법은 다음과 같습니다.

저자：Eve Cole 업데이트 시간：2025-01-21 13:33:52

/*지금 제가 사용하는 것은 Dan이 공유한 버전을 기반으로 단순화하고 형식화하여 수정한 것입니다*/
/*사실 이것은 가장 간단한 템플릿이 아닙니다. http://hi.baidu.com/nagato_yuki/css/item/af51f3de5971235494ee379b.css*/를 살펴보세요.

a,a:링크,a:활성,a.on,a.on:방문
{
색상:#000000!중요;
텍스트 장식:없음
}

a:호버
{
텍스트 장식:밑줄
}

몸
{
글꼴 계열:"Microsoft Yahei",sans-serif;
배경:url(<A href="/u/info_img/2009-06/12/4256bbefadc04dfbce1b3e07.jpg)
}

/*머리*/
#헤더
{
높이:200px;
왼쪽 패딩:120px;
배경:url(<A href="/u/info_img/2009-06/12/d6ca82771cecae0eb151b93f.jpg) 반복 없음 센터
}

#헤더 div.tit,#헤더 div.tita.titlink,#헤더 div.tita.titlink:방문
{
표시:없음
}

#headerdiv.desc
{
상단:125px;
왼쪽:500px;
색상:#fff;
글꼴 크기:12px;
글꼴 계열:"Microsoft Yahei",sans-serif
}

#테이블라인
{
표시:없음
}

#꼬리표
{
왼쪽:150px;
상단:170px;
배경:없음
}

#tab a:링크,#tab a:호버
{
글꼴 크기:12px;
배경색:없음;
텍스트 장식:없음;
색상:#000000!중요
}

#tab a:방문,#tab a.on
{
글꼴 크기:12px;
배경색:없음;
색상:#FFFFFF!중요
}

#탭 범위
{
표시:없음
}

.단계
{
텍스트 정렬:가운데;
배경:url(<A href="/u/info_img/2009-06/12/6e546254f8773740564e00d5.jpg) 반복-y 센터
}

.스테이지패드
{
너비:740px;
여백:0 자동
}

#공들여 나열한 것
{
테이블 레이아웃:고정;
너비:740px;
여백:0 자동
}

#공들여 나열한 것
{
여백 상단:-10px
}

#레이아웃 td.c1t1,#레이아웃 td.c2t1,#레이아웃 td.c2t3,#레이아웃 td.c3t1,#레이아웃 td.c3t3,#레이아웃 td.c3t5
{
패딩 상단:10px
}

#레이아웃 td.c2t3
{
배경색:#f8f8f8
}

#레이아웃 td.c2t1
{
테두리 하단:1px 솔리드 #808080
}

#레이아웃 td.c2t3
{
테두리 하단:1px 솔리드 #808080
}

#레이아웃 td.c2t2
{
테두리 오른쪽:1px 솔리드 #f8f8f8;
테두리 하단:1px 솔리드 #808080
}

#comm_info
{
색상:#000;
글꼴 계열:"Microsoft Yahei",sans-serif;
텍스트 정렬:왼쪽
}

#comm_infodiv.line
{
여백 상단:5px;
줄 높이:8px;
background:url(<A href=") 반복 없음 하단;
패딩 하단:40px;
여백-하단:10px
}

#페이지
{
높이:30px;
글꼴 크기:14px;
글꼴 계열:"Microsoft Yahei",sans-serif;
텍스트 정렬:오른쪽
}

.모드
{
여백-하단:10px
}

.modth
{
높이:24px
}

.modhead
{
패딩:4px4px04px
}

.modopt
{
패딩:4px4px00
}

.modtit
{
색상:#000;
글꼴 크기:12px;
글꼴 계열:"Microsoft Yahei",sans-serif;
글꼴 두께:굵게
}

a.modtit
{
색상:#000
}

a.modtit:방문함
{
색상:#000
}

.modtitlink
{
색상:#000;
글꼴 크기:12px;
글꼴 두께:굵게
}

a.modtit링크
{
색상:#000;
텍스트 장식:없음
}

a.modtitlink:방문함
{
색상:#000;
텍스트 장식:없음
}

a.modtitlink:호버
{
색상:#000;
텍스트 장식:밑줄
}

.modact
{
색상:#000;
글꼴 크기:12px;
글꼴 계열:"Microsoft Yahei",sans-serif;
텍스트 장식:없음
}

a.modact:링크
{
색상:#000
}

a.modact:방문
{
색상:#000
}

a.modact:호버
{
색상:#000;
;
텍스트 장식:밑줄
}

.modbox
{
패딩:10px 10px 0 10px;
배경색:없음
}

.modtl
{
배경:없음
}

.modtc
{
배경:없음
}

.modtr
{
배경:없음
}

.modbl
{
배경:없음
}

.modbc
{
배경:없음
}

.modbr
{
배경:없음
}

/*기사 영역*/
#m_blog div.tit,#m_blog div.tit a,#m_blog div.tit a:방문,#m_blog div.tit a:hover
{
색상:#000;
글꼴 크기:16px;
글꼴 두께:굵게;
글꼴 계열:"Microsoft Yahei",sans-serif;
여백-하단:20px
}

#m_blogdiv.cnt
{
색상:#555;
줄 높이:26px;
글꼴 크기:13px;
글꼴 계열:"Microsoft Yahei",sans-serif;
여백-하단:20px
}

#m_blog div.cnt a,#m_blog div.cnt a:방문,#m_blog div.cnt a:hover
{
텍스트 장식:밑줄!중요
}

#m_blog div.more,#m_blog div.more a,#m_blog div.more a:visited,#m_blog div.more a:hover
{
텍스트 정렬:오른쪽;
여백 하단:20px;
}

#m_blog div.opt,#m_blog div.opt a,#m_blog div.opt a:방문
{
글꼴 크기:12px;
텍스트 장식:없음;
글꼴 계열:"Microsoft Yahei",sans-serif;
텍스트 정렬:오른쪽;
여백 하단:20px;
}

#m_blog div.opt a:hover
{
텍스트 장식:밑줄
}

#m_blog div.line
{
여백 상단:17px;
줄 높이:17px;
테두리 상단:1px#000000점선;
여백-하단:20px
}

#m_blog div.none
{
패딩:100px 0 100px 0;
색상:#000;
글꼴 크기:14px
}

/*개인 파일 영역*/
#m_프로
{
글꼴 계열:"Microsoft Yahei",sans-serif;
텍스트 장식:없음
}

#m_pro a:방문함
{
텍스트 장식:없음
}

#m_pro a:호버
{
텍스트 장식:밑줄
}

#m_prodiv.이미지
{
텍스트 정렬:가운데
}

#m_prodiv.act
{
여백 상단:10px
}

#m_prodiv.user
{
여백 상단:10px;
색상:#000;
글꼴 크기:12px;
글꼴 두께:굵게;
글꼴 계열:"Microsoft Yahei",sans-serif
}

#m_prodiv.desc
{
색상:#666;
글꼴 크기:12px;
글꼴 계열:"Microsoft Yahei",sans-serif
}

#m_pro div.line
{
여백 상단:17px;
줄 높이:17px;
테두리 상단:1px 점선 #E4E2DA
}

#m_프로 TD
{
색상:#666;
줄 높이:24px;
글꼴 크기:14px;
글꼴 계열:"Microsoft Yahei",sans-serif;
}

#m_albumdiv.image
{
텍스트 정렬:가운데
}

#m_album div.page
{
색상:#666;
글꼴 크기:12px;
텍스트 정렬:가운데
}

#m_albumdiv.pagea
{
색상:#666;
글꼴 크기:12px
}

#m_album div.page a:방문함
{
색상:#666
}

#m_links div.item,#m_mylink1 div.item,#m_mylink2 div.item,#m_mylink3 div.item,#m_mylink4 div.item
{
색상:#666;
글꼴 크기:12px;
글꼴 계열:"Microsoft Yahei",sans-serif;
}

#m_links div.item a,#m_mylink1 div.item a,#m_mylink2 div.item a,#m_mylink3 div.item a,#m_mylink4 div.item a,#m_links div.item a:visited,#m_mylink1 div.item a :방문함,#m_mylink2 div.item a:방문,#m_mylink3 div.item a:방문,#m_mylink4 div.item a:방문,#m_artclg div.item a,#m_artclg div.item a:방문,#m_filed div.item a,#m_filed div.item a:방문,#m_filed div.item a,#m_filed div.item a:방문,#m_comment div.item a,#m_comment div.item a:방문,#m_comment div.item a.cnt:hover,#m_cang div.item a,#m_cang div.item a:방문, #m_friblog div.item a,#m_friblog div.item a:방문,#m_friblog div.item a:방문,#m_friblog div.item a.cnt,#m_friblog div.item a.cnt:방문,#m_friblog div.item a.cnt:hover
{
글꼴 크기:12px;
글꼴 두께:일반;
글꼴 계열:"Microsoft Yahei",sans-serif;
텍스트 장식:없음
}

#header div.tit,#header div.tita.titlink,#header div.tita.titlink:방문,#tabline,#tabspan,#m_blog div.date,#m_comment_post div.toolbarstrip,#m_comment_post div.toolbaritem,#in_send div.toolbarstrip,#in_send div.toolbaritem,#mod_info,#m_comment_post,#m_mylink2 div.line,#m_mylink3 div.line,#mod_artclg div.line,#mod_filed div.line,#vercode,#yanzheng,#m_pro div.userinfo,#m_proa.btfan
{
배경:#투명;
표시:없음
}

#m_mylink2 div.item,#m_mylink3 div.item,#mod_artclg div.item,#mod_filed div.item
{
부동:왼쪽;
높이:20px;
패딩:5px
}