각주 만들기

이 블로그에서 발행한 〈불 꺼진 공장과 노동의 미래〉는 다음과 같이 각주를 만들었습니다.

Footnotes CSS
<sup><a id="fn2025xxxx01” href=“#2025xxxx01”>1</a></sup>
<sup><a id="fn2025xxxx02” href=“#2025xxxx02”>2</a></sup>






<ol>
<li id="2025xxxx01">각주1<a href="#fn2025xxxx01">svg</a></li>
<li id="2025xxxx02">각주2<a href="#fn2025xxxx02">svg</a></li>
</ol>

<svg width="14" height="14" viewBox="0 0 20 20" aria-hidden="true"><path d="M8.5 4a.5.5 0 010 1H6a2 2 0 00-2 2v7c0 1.1.9 2 2 2h7a2 2 0 002-2v-2.5a.5.5 0 011 0V14a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h2.5zm8-1a.5.5 0 01.5.43V9.5a.5.5 0 01-1 .09V4.7l-6.15 6.15a.5.5 0 01-.76-.63l.06-.07L15.29 4H10.5a.5.5 0 01-.09-1h6.09z" fill-rule="nonzero"></path></svg>


HTML 편집
1. 테마〉맞춤설정〉백업
2. 맞춤설정〉HTML 편집
3. 아래 코드를 ]]></b:skin> 전에 붙이고 저장
:target { 
    background: #eaf1fb;
    transition: all .8s; 
}


참고
  1. Footnotes CSS
  2. Highlighted Footnotes like Wikipedia with CSS

Comments