バカネコ日記

フリーページ

2005年05月15日
XML
カテゴリ:バカネコPC講座
バカネコ村の記事を検索する
本日のバカネコ講座は、背景の使い方について。

写真の上に文章を重ねる、つまり、写真を背景として
文章を書く方法について紹介しよう。
すでに、使いこなしておられる方も多いが、一応初めての方のために。

通常のwebサイトなら、ページ全体に背景を使うのは、簡単だ。
ボディタグ<body>に、background="画像のURL" 
という呪文を仕込んでおしまい。 つまりこうだ。
<body background="画像のURL">

だが、楽天日記のようなブログでは、ボディタグがいじれないので、
少し小細工が必要だ。
なので今回は、よく使う表組み、すなわちテーブルタグ<table>を使ってみよう。

ではさっそく、始める。
カラッポのテーブルは、
<table><tr><td></td></tr></table>
と書けば良い。 中身は仮に、「こんにちは」とでもしておこうか。

つまり、こう書く。
<table><tr><td>こんにちは</td></tr></table>
これは、1行1列の表、というより、タダの枠だ。

これに、背景をセットしよう。
何のことはない、先ほど出てきた、background="画像のURL" という呪文を放り込むだけである。
backgroundというのは、背景という意味であるから、そのまんまである。

<table background="画像のURL"><tr><td>こんにちは</td></tr></table>
これで、テーブル全体の背景がセットされる。
もちろん、いつも通り、テーブル内部に好きな文章が書けることは言うまでもない。

ためしに、ライオンの画像を設定してみる。
<table background="画像のURL"><tr><td>こんにちは</td></tr></table>
こんにちは

 ↑ ありゃりゃ、なんじゃ、こりゃ。

サイズ指定を忘れると、こうなる。
じゃ、テーブルのサイズを指定しよう。
幅は width、高さは heightで指定するのであった。
写真のサイズに合わせて、テーブルのサイズを指定してみると...
    ↓
<table background="画像のURL" width="400" height="400"><tr><td >こんにちは</td></tr></table>

こんにちは


ライオンは出てきた。
さっきのは、左上の片隅しか出ていなかったわけだ。
しかし、「こんにちは」はどこに行った?

原因は簡単。
黒い背景に、黒い文字だからよく見えないのだ。
じゃ、文字色を白くするか。 ついでにサイズも大きくしてみよう。
   ↓
<table background="画像のURL" width="400" height="400"><tr><td><font size="6" color="#FFFFFF">こんにちは</font></td></tr></table>


こんにちは


こうやれば、画像処理などしなくても、写真の上にがんがん文字が重ねて書けるわけだ。
ただ、注意点すべき点も多々あるが、それはまた次回にしよう。


【今日のポイント】
1.背景を使うと、写真の上に文章を簡単に重ねて書ける。
2.雰囲気作りにも使える。


【次回予告】
 背景の設定 その2
 画像と枠の大きさの関係。
 中身の文章の位置決め。

【トド短信】
 背景か...これ、奥が深いんだよね。


 この記事がおもしろかったと思う人は1票! クリック →おもしろかったらクリックしてね



【ダウンロードページ】
・楽天日記専用バックアップツール、バーニャン3号のサンプル版、
 「バーニャン・ミニ」のダウンロードはこちら。
・にゃんタグのサンプル版は、このページの中段付近。
・バカネコ・ビューアのダウンロードはここ。


※バカネコ講座では、安全な方法を選んで紹介していますが、
 途中でわけがわからなくなっても、責任は負えませんので、あらかじめご了承下さい。





ネコでもわかるPC講座はこちら → バカネコ講座
秋葉原にもない楽天専用ツール  → バカネコソフト



【楽天トラベル】 バカネコ講座 バカネコソフト バカネコ村 爆笑ガイド 猫砂の研究 パソコン購入費用の削り方 現物の投下位置 ずぼらなアクセスアップ ページを読みやすくする方法 バーニャン1号ミニ バーニャン1号の秘密 にゃんこのコスプレ テキストリンク下線の消し方 楽しめるアフィリ 己を知れ 自分のPCを知る バカネコ・ビューア バーニャン3号 にゃんタグ・フルバージョン


HTMLオンチでもOK! いきなり使える



画面右上「日記リンク追加」をクリック、「◎追加する」ボタンを押すとこの日記がリンクできます。
このサイトの新着記事の通知をご希望の方はご利用ください。







最終更新日  2005年05月16日 20時39分30秒
コメント(20) | コメントを書く

PR

バックナンバー

2019年08月
2019年07月
2019年06月
2019年05月
2019年04月

プロフィール


海獣トド

コメント新着

 海獣トド@ Re:意外な一面に触れて。(08/14) 泡雪さんへ >マザーテレサって本当にす…
 海獣トド@ うめぼしがキラリ☆さんへ >ひゃー、ブログさぼってる間にトドさん…
 海獣トド@ 鵜の岬さんへ >これからも・・ヨロシク・・ね こち…
 海獣トド@ sshijimisanさんへ >でも、トド様のおかげで少しの村民は救…
 海獣トド@ もぐらのこさんへ >日記の下書き機能残ってるよ(^-^) …
 海獣トド@ archfelisさんへ >せめて12日一杯残せばいいのに・・・…

Copyright (c) 1997-2019 Rakuten, Inc. All Rights Reserved.