読者です 読者をやめる 読者になる 読者になる

Web言語のお勉強~ど素人が往く~

かつてVB6を1年くらい触った事があるだけのど素人がWeb言語に挑戦します。勉強結果を随時発表します。

はてなブログのスマホ表示でヘッダーとフッターを消してみる!


はてなブログ

CSSの試験です。
はてなブログのスマホ表示でヘッダーとフッターを消してみましょう!

<style>
#globalheader-container {
    display:none;
}

#footer-menu {
    display:none;
}
</style>

とりあえずは記事本文に書いてテスト。

フッターはきれいに消えた!

ヘッダーは消えたけど、変なスペースが残っている(>_<)

f:id:MoneyReport:20150611114949p:plain

要素を追加

スタイルシートに要素を追加してみましょう!
「#container」が怪しそうです。

<style>
/* 余白調整 */
#container {
    padding-top:0px;
}
</style>

今度はきれいにヘッダーの余白部分もなくなりました!

f:id:MoneyReport:20150611115214p:plain