프로그래밍/블로그

[티스토리 스킨] 부트스트랩(bootstrap) + 티스토리(tistory) - 9. 하단 정보(푸터)

당근천국 2016. 9. 18. 15:00

처음 계획은 푸터를 화려하게 꾸미는 거였는데......

푸터의 역할상 깔끔한 게 더 의미가 있어서 그냥 중앙정렬만 하고 넘어가겠습니다.

 

설명

부트스트랩의 그리드 시스템에서 푸터는 하단에 12칸을 혼자 사용하도록 하겠습니다.

이렇게 하면 항상 하단에 나오게 되죠.

중앙정렬은 'text-center'로 처리하면 됩니다.

 

 

설명

코드는 스타일에 부트스트랩 스타일만 적용했습니다.

 

bootstrap_tistory_009.txt

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!-- 4. 푸터 -->
<div id="footer" class="col-md-12 text-center">
    <!-- 4-1. 메뉴  -->
    <div class="menu">
        <a href="https://danggun.tistory.com/m/location">지역로그</a> :
        <a href="https://danggun.tistory.com/m/tag">태그</a> :
        <a href="https://danggun.tistory.com/m/guestbook">방명록</a> :
        <a href="https://danggun.tistory.com/m/manage">관리자</a> :
        <a href="https://danggun.tistory.com/m/manage/entry/post">글쓰기</a>
    </div>
    <!-- 여기까지 - 4-1. 메뉴  -->
    <!-- 4-2. 저작권 표기  -->
    <div class="copyright">
        <a href="https://blog.danggun.net/m/"> 당근천국</a>'s Blog is powered by <a href="http://daum.net" onclick="window.open(this.href); return false">Daum</a>  / Designed by <a href="http://www.tistory.com">Tistory</a>
    </div>
    <!-- 여기까지 - 4-2. 저작권 표기  -->
</div>
<!-- /4. 푸터 -->
cs