このブログでは、ソースコードを書く事が多いんですが、それをはみ出さずに表示する
HTMLとスタイルシートの書き方です。

多くのブログのサイドバーは固定のため、トップページと１記事ページで同じものが表示されます。
変える事は出来ません。

私が実際に使っているブログでは、Seesaaはトップページと１記事ページでサイドバーを変えられます。しかし、FC2、Ameba、ライブドア、JUGEM、そしてファンブログでは変えられません。

でも、トップページと１記事ページで違う広告を出したい！という時に、スタイルシートでやる方法を説明します。

ちなみに今このブログでは、トップページと１記事ページで左サイドバーに違う広告が出ています。

こんばんは。「ここにブログの名前を入れます」略して「ナマ入れ」です。

人のコメント欄に長々説明するのは、良くないと思ったので、記事にします。
でも、そう考えたのは、もう書き込んでしまった後でした。

リンク貼ってくれていたし、これから同じ疑問を持つ人もいるだろうから。
ついでに、トラックバックも送っておこう。

メディア属性 - HTML5で縦書き年賀状4のつづき、最終回です。

リセットCSS後編 - HTML5で縦書き年賀状3のつづきです。

まず「Internet Explorerで背景も印刷する方法」の手順で、印刷でも背景画像を表示する設定にしてください。終わったら、このページを印刷プレビューで見てみてください。ヘッダーの画像が小犬ではなくなっているはずです。

印刷プレビューの方法

メニューバーのファイルから、印刷プレビューを選択します。

このように、普段の表示と印刷時などで、読み込むスタイルシートを変更することができます。今回は、この機能を使って、ブラウザを見ながらレイアウトを作る時は枠線を表示して、印刷の時にはその枠線が表示されないようにします。

ということで、この下が、印刷用年賀状HTMLのソースです。

前回ファンブログのスタイルシートを読み込まずにhtmlファイルを表示したら、思い通りに表示されませんでした。

ソースは同じなのに何故、違う表示がされるのか？
それは、スタイルシートの初期値が違うからです。

InternetExplorerやfirefoxなどのブラウザはそれぞれにスタイルシートの初期値を持っています。
何もスタイルシートを読み込まない場合、その初期値を使います。

前回使ったhtmlファイルは、「縦書きHTML」という記事で使ったソースを流用しました。そのソースはファンブログのスタイルシートを基準に作られています。だから、そのファンブログのスタイルシートを先に読み込まないと基準値が違うために、表示が変わります。

これと同じことは、ブラウザを変えただけで起こります。

しかし、今見ているページはInternetExplorerで見ても、firefoxで見ても、ほとんど同じように表示されます。それは、各ブラウザの初期値をファンブログのスタイルシートでリセットしているからです。

画像を半透明にする方法、すける画像の作り方です。今回はこの画像をサンプルにします。

【即日発送】エレガントモーメント/ペアでパイロット&スチュワーデスなりきりコスチューム/ランジェリーセット 在庫限り最終処分セール EM7790

presented by amazon

これを加工してこんな感じにします。この程度の加工に画像編集ソフトは不要です。