HTMLタグ/CSS一覧と初心者向けホームページ作成解説集:HTMLタグボード
HTMLタグボードのトップへ戻る ゼロから始めるホームページ作成講座 訪問者優位のWEBデザインTips インターネットで小遣い稼ぎ 今すぐ使える!便利ツール(HTMLタグ辞典など)

HTMLタグボードトップ >> ゼロから始めるホームページ作成講座 >> 実際に作ってみよう >> 背景を設定する
お問い合わせはこちら サイトマップはこちら

実際に作ってみようメニュー
1.初期設定をする
2.ファイルの新規作成
3.背景を設定する
4.文字に変化を与える
5.表を作成する
6.画像を挿入する
7.リンクを指定する
8.ファイルを保存する

背景を設定する [タグ編]

[ ソフトで編集 ] [ 直接タグで編集 ]

背景を変えてみよう - 色指定

背景の初期設定は白(#FFFFFF)ですが、これを好みの色に変更したり、背景に画像を使用したりすることができます。ここではタグで直接編集する方法を紹介します。メモ帳などを起動して、以下のように入力してください。


操作手順

デスクトップから[スタート]→[プログラム]→[アクセサリ]→[メモ帳]でメモ帳を起動する。
起動したら、以下の文字を入力するか、コピーして貼付(コピー&ペースト)をする。


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta
http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta
http-equiv="Content-Style-Type" content="text/css">
<title>背景を変えてみよう</title>
</head>
<body bgcolor="#fff4dd">
</body>
</html>

このタグのサンプルはこちら

記述手順

<body>というタグに「bgcolor=""」という属性をつけて色を指定することで、背景色を設定できます。赤字の部分を任意の「#(シャープ)+任意の6桁のカラーコード」に変更してください。



背景を変えてみよう - 背景画像を指定する

背景は色指定だけでなく、画像を使用することもできます。


記述手順

<body>というタグに「background=""」という属性をつけて背景画像の場所を指定することで、背景を設定できます。赤字の部分を変更します。使用したい背景画像の場所を相対パスまたは絶対パスで記述します。(以下の例は相対パス)


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta
http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta
http-equiv="Content-Style-Type" content="text/css">
<title>背景を変えてみよう</title>
</head>
<body bgcolor="#fff4dd" background="img/03005.gif">
</body>
</html>

このタグのサンプルはこちら

画面のトップへ戻る

こんな時どうする?

色の見本が欲しい


カラーチャート (紹介サイトへ)

Web Safeカラー 216色 - TAG <index>


こんな時どうする?

色を表す#FFFFFFっとかって何ですか。


色のカラーコード

色の指定をするとき、原色のような白や黒、赤などは白(white)、黒(black)、赤(red)のように指定できますが、より繊細な色を表現するにはさらに細かく色を指定することが必要になってきます。


そこでHTMLでは、色の指定を16進数で指定することが決められています。6ケタのこの文字を2文字ずつに分け、最初の2文字が、さらに真ん中の2文字が、最後の2文字がというように色の三原色を指定します。各2文字は「00〜FF」までが割り当てられ、FFがそのケタの原色(最初の2文字なら赤)で、00に近づくにつれて、色が薄くなります。


よって、例えば原色のは「#FF0000」、は「#00FF00」、は「#0000FF」となり、これらの組み合わせで色が指定できます。ちなみに白は「#FFFFFF」、黒は「#000000」です。


なお、これらのカラーコードを調べたいときは上のカラーチャートを参考にしてください。



こんな時どうする?

カッコイイ背景画像の素材が欲しい


WEB素材 (紹介サイトへ)

牛飼いとアイコンの部屋
無料壁紙専門「無料職人!」
無料壁紙(ホームページ用) - 0円のWEB素材屋さん
背景画像素材館 - モグボックス
フリー素材:背景画像 - 谷口印刷
WEB素材 - D.T.Ag


こんな時どうする?

背景を指定するタグの書き方


HTMLタグ辞典
背景色を指定する
背景画像を指定する

<< 前のページ 1 2 3 4 5 6 7 8 次のページ >>

画面のトップへ戻る

ゼロから始めるホームページ作成講座のトップへ

必要なものを揃えよう
伝えたい情報を考えよう
仕組みを理解しよう
実際に作ってみよう
作ったファイルを公開しよう
製作にあたり注意すべきこと
練習問題にチャレンジ!

訪問者優位のWEBデザインTipsのトップへ

インターネットで小遣い稼ぎのトップへ

今すぐ使える!便利ツールのトップへ