• ベストアンサー

色の明暗を変えるには?

このページ↓にあるように左にいくほど濃く、右にいくほど薄くなるような 表現はどのようにすればいいのですか? (背景や水平線など) http://www.ume.sakura.ne.jp/~rei/top.html

  • HTML
  • 回答数3
  • ありがとう数0

質問者が選んだベストアンサー

  • ベストアンサー
  • yuhei-y
  • ベストアンサー率54% (28/51)
回答No.2

ご質問にあるホームページを拝見したところ、 これらのグラデーション表現は、画像で実現されています。 つまり、右に行くほど色が薄くなる画像を作成し、 それを背景画像または、区切り線として使用しているのです。 具体的にHTMLで表すと、次のようになります。 <html> <body background="bgimage.gif"> <img src="lineimage.gif"> </body> </html> 上記のHTMLを解説をすると、 「bgimage.gif」が、ご質問にあったホームページ上で言うところの 格子状の画像にあたり、 「lineimage.gif」が、区切り線の画像となります。 HTMLやJavaScriptでは、これらのようなグラデーション表現は不可能です。 ですから、画像を使用しているわけです。 ぜひとも、状況に応じて画像を駆使し、 素晴らしいホームページを作成してくださいね。

その他の回答 (2)

  • kenkenkent
  • ベストアンサー率30% (565/1854)
回答No.3

御質問にあるHPですが、これは背景の格子状の物も、 水平線も、画像を配置していますね。 背景画像に関しては、繰り返し表示されますので、 格子を縦1マス分だけ作ってやれば、格子状の様になります。 http://www.atmark.gr.jp/~image/ ちなみに、こちらのサイトでも背景にグラデーションを 使っていますが、これはbackground.jpgと言う、 1200×1ピクセルの背景画像を繰り返し表示させています。

参考URL:
http://www.atmark.gr.jp/~image/
  • starflora
  • ベストアンサー率61% (647/1050)
回答No.1

    このページにある、白い格子模様は、「背景画像」です。言い換えると、左から右に、色が段々薄くなる画像を背景画像、background= に入れると、こういう効果が出てきます。その場合、背景画像は、厚さ1ピクセルとかでも行けます。     htmlでは、こういう効果は出せません。JavaScript を使うと、段々明るくなるとか、背景の色が段々変化するとか作れますが、htmlではできないはずです。  

関連するQ&A

  • スクロールバーについて

    下のHPのようにスクロールバーの色を変えるには どうすればいいのですか? http://www.ume.sakura.ne.jp/~rei/top.html

  • ホームページ作成に詳しい方。背景の設定方法を教えてください(Mobile Space)

    ホームページ作成に詳しい方。背景の設定方法を教えてください(Mobile Space) Mobile Spaceで両脇にラインが入っている画像をトップページの背景画像にしたいんですが、 トップページの設定で画像コードを入力して、いざ表示したら左のラインが右のラインよりも太くなっているんです。 友達が、トップページの編集で<center>を入れるとか教えてくれたのですが、よくわかりません… どなたか教えて下さい。

  • 離れた場所への文字表示

    下に紹介したHPからの参照となるのですが 画像から離れた場所へ、それも一つの場所へ 文字を表示するにはどのようにしたらいいのですか? (下のHPの一番上の部分です) http://www.ume.sakura.ne.jp/~rei/top.html

  • 背景画像にリンク

    背景に画像を固定して表示したページに、リンクを貼りたいのです。 フレームページで縦に2分割、左のページにスタイルシートで背景固定、BODYタグ内には何もなし、右のページも同じくスタイルシートで背景固定、こちらに左のページの背景画像内にある文字からリンクを貼り、そのリンクをはったページを右ページ内に反映させたいのです。 一枚の大きな画像を2分割して左と右のページでそれぞれ固定しているので、IMGタグはなるべく使いたくありません。 (IMGタグでスタイルシートでの背景固定ように、right bottomと出来るのならば全く問題ないので、その場合は教えてください^^;)

  • フレーム分割について

    初心者です HPビルダー8ですが、垂直2分割で、左に目次、クリックすると右にそのページが表示できるといったものですが、方法がよくわかりません。 何ページか作っていますが、TOPページを開いておいて、フレームページの作成にして左にTOPとか自己紹介とか入れて、リンクを貼って、エクスプローラで表示すると、TOPページの中にも、TOPとか自己紹介と、左側と同じものが出てしまいます。 右側のTOPとか自己紹介とかを消して左側だけに目次がでるようにする方法がわかりません。 また、保存の方法についてもわかりません。 表現が下手で申し訳ありません。 ご不明な点があれば補足しますので、よろしくお願いします。

  • フレームが!!

    フレームを使ってホームページを製作しています。 一番最初のトップページでページを上と下に分割して 上にあるリンクボタンを押すと、下に表示されるページに 右と左で別れるページを作成したのですが・・・ _____ |     | ――――― |  |  | |  |  | ――――― ↑こんな風に。。  何故か下の左を押して右の下に別ページを表示しようとすると、左の下のページが消えて 右の下のページだけになってしまいます。。 どうすれば左のページが消えないように、右のページが表示できるのでしょうか? ちなみに右下左下のページはトップとは別のフォルダにあります。

    • ベストアンサー
    • CSS
  • インラインフレームで可能ですか?

    作成したいページの構造としては上部にタイトル、左にメニュー、右に表示したいページ。の3分割です。今はインラインフレーム、フレームは作成していません。やりたいことは、左のメニューをクリックするとトップのタイトルと左のメニューはそのままで右側にそれぞれメニューでクリックしたページが表示されることです。フレームを使えば可能だと言うのはわかるのですが、背景を設定したいのです。http://www.peachjohn.co.jp/ こちらのサイトは背景がピンクになっていて画面の大きさによって背景の見える範囲が変わっています。このように壁紙も設定したいのです。フレームで3分割せずに右側をインラインフレームにしてメニューをクリックするとインラインフレームのみ表示が切り替わるということ出来ますでしょうか?質問の仕方が下手くそですみません・・・お願いいたします。m(__)m

  • Seesaaブログの記事タイトルの上に出る項目リンクの削除について

    専門用語がわからないのですが、ブログを見るとページの上や下に <<前の項目 TOP 後ろの項目>> や <<1 2 3 4 5 6>> というようなものが付いています。背景の色も左から右にかけて付いています。 どうも違和感があるので、これらを削除したいと考えているのですが、どのようにすれば削除できるのでしょうか? ご指導のほどよろしくお願い致します。

  • ブラウザ上で、ワード文書を表示できますか

    ホームページ(という表現が正しいかどうかは分かりませんが)を作成しようと考えています。 トップページと各ファイル(ワード文書)をリンクさせたいです。 トップページは3つのフレームに分けたいです。 上にはタイトル(ロゴ) 左にリンクメニュー(文書名) 右の大きなフレームに、文書を表示させたいのです。 ワードを起動しなくても、ブラウザ上で表示させることはできるのでしょうか?

  • フレームとリンク

    現在フレームによって左(frame1)と右(frame2)にわけてあるのですが、左に『topへ移動します』という文字を入れて それを押すと左のページは1.htmへ。 右のページは2.htmへというように同時にリンク先へ行くようにしたいのですがどうすればよいのでしょうか? いわいる左ページのリンク指定のプログラムだけおしえて いただけないでしょうか?困っています。。

    • ベストアンサー
    • HTML

専門家に質問してみよう