装飾する(footer部分)
footer部分を装飾する
そろそろ終わりが見えてきました。最後のフッター部分です。まずhtmlを確認しましょう。
<div id="footer"> <p id="copyright">Copyright © <a href="http://taghtml.com">taghtml</a> All Rights Reserved.</p> </div>
次にスタイルを設定していきます。
フッター上部に仕切り線としてborder-topを利用しつつ、marginとpaddingで余白の調整を行います。
#footer { margin-top: 30px; border-top: 3px solid #745850; padding-top: 20px; padding-bottom: 20px; } #copyright { text-align: center; } #copyright a{ text-decoration: none; }
確認してみよう
その他、marginやpaddingで余白の微調整をしたものをf2cホームページにアップロードしました。実際に見てみましょう。以上で完成になります。
ここまで読んで下さった皆様へ
長くお付き合い頂き、ありがとうございました。