Google Blogger에서 각주를 작성하는 방법입니다. <sup>태그를 이용하여 위 첨자 각주를 작성할 수 있습니다.
Google Blogger에서 각주를 작성하는 방법입니다. 아래 태그를 사용하여 각주를 작성할 수 있습니다.
<footnote>단어</footnote><sup>단어</sup>- 위 첨자<sub>단어</sub>- 아래 첨자
각주 작성 방법
아래는 글쓰기 에디터 HTML 모드에서 각주 작성 예시입니다. 결과 탭을 클릭하여 확인해주세요!
<style>.height_fix {margin-top: -70px;padding-top: 70px;}</style>
블로그스팟에서 각주를 작성해 봅시다! 각주<sup><a class="height_fix" href="#1Down" id="1Up">[1]</a></sup>작성 시작!
html모드에서 수동으로 작성<sup><a class="height_fix" href="#2Down" id="2Up">[2]</a></sup>html 모드로 글쓰는 스킬이 증가할 거 같네요! 대박<sup><a class="height_fix" href="#3Down" id="3Up">[3]</a></sup>
<!--[ 설명 ]-->
<div><sup><a class="height_fix" href="#1Up" id="1Down">[1]</a> 여기에 설명을 적어 넣습니다.</sup></div>
<div><sup><a class="height_fix" href="#2Up" id="2Down">[2]</a> 여기에 설명을 적어 넣습니다.</sup></div>
<div><sup><a class="height_fix" href="#3Up" id="3Down">[3]</a> 여기에 설명을 적어 넣습니다.</sup></div>
첨자 부분과 설명 부분에 형광펜으로 표시된 하이퍼링크와 아이디 값을 확인해주세요. 해당 ID로 이동하는 방식이므로 위 첨자 부분과 설명 부분이 서로 반대가 되어야 합니다.
1. 이동 위치 조정
상단 고정 스타일 테마에서는 해당 ID로 이동하면 헤더에 가려지게 됩니다.이것을 해결하기 위해서는 링크에 클래스를 지정하고 스타일을 추가해야 합니다.
<style>.height_fix {margin-top: -70px;padding-top: 70px;}</style>- 헤더의 높이보다 조금 더 큰 값으로 설정합니다.<a>태그에 스타일을 추가합니다. -<a class="height_fix" href="#1Down" id="1Up">[1]</a>
2. 티스토리 각주 작성 방법
티스토리는 블로그스팟보다 훨씬 친절한 편입니다. 에디터 기본모드에서 [footnote]태그를 이용하여 작성하면 하단에 자동으로 설명과 본문으로 이동하는 링크가 출력됩니다.
- 작성 예시 -
단어[footnote]단어 설명[/footnote]