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

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

 

설명

부트스트랩의 그리드 시스템에서 푸터는 하단에 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="[##_localog_link_##]">지역로그</a> :
        <a href="[##_taglog_link_##]">태그</a> :
        <a href="[##_guestbook_link_##]">방명록</a> :
        <a href="[##_owner_url_##]">관리자</a> :
        <a href="[##_owner_url_##]/entry/post">글쓰기</a>
    </div>
    <!-- 여기까지 - 4-1. 메뉴  -->
    <!-- 4-2. 저작권 표기  -->
    <div class="copyright">
        <a href="[##_blog_link_##]"> [##_blogger_##]</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

 

댓글 작성

이름
패스워드
홈페이지
비밀글

티스토리 툴바