画像の固定について

HTML版過去ログ

日時： 2006/02/08 17:49
識別： IDBa7F9oEWSfs
名前：うり: 初めまして。初歩的な質問なのですが、よろしくお願いします。

背景画像を左下に固定したいのですが、スタイルシートで水平方向：左、垂直方向：下に設定したところ、確かにプレビューでは左下に固定されているのですが、編集画面でその画像が全く表示されません。テキストのみです。スタイルシートで設定する前にただ背景画像を挿入しただけの時点では、画像は表示されています。

アップロードして確かめると、私のパソコンではきちんとプレビュー通り画像が表示されていました。
ですが、これは他の方が見てもこの通りに表示されているのでしょうか。とても不安です。編集上不都合もありますし、編集画面で画像を表示させる方法はないのでしょうか。

どうぞよろしくお願いいたします。

Re: 画像の固定について ( No.1 )

日時： 2006/02/08 18:13
名前： Newのり太

BODY{
background-image : url(gazou.gif);
background-repeat : no-repeat;
background-attachment : fixed;
background-position : left bottom;}

↑この、background-position の記述が
勝手に変わってしまう（消えてしまう）という状況を自分も経験したことがあります。
# 今まさにその状況が再現しています。
# 位置を色々いじっていると消えてしまいました。(T_T)
# ページを一度閉じて再設定したら復活しますた。バグなのか？

あと、HPBの編集画面は、スタイルシートについていけない場合があるようです。
まあ、ソースできちんと書かれていれば、たいていのブラウザなら
意図どおり表示されるのではないかと思います。

Re: 画像の固定について ( No.2 )

日時： 2006/02/08 19:03
名前：うり

Newのり太様、御回答どうも有難うございます。
ではスタイルシートを使った場合、編集中に画像を表示させる事は
諦めた方が良いという事でしょうか？

実は最初は御回答にもありました固定タグを貼り付ける方法でやっていたのですが、
うまく表示されずスタイルシートで設定する方法にしたんです。
<HEAD>と</HEAD>の中に貼り付けると幾つかの素材配布サイト様で見たのですが、
その中には他のタグがあってどこに貼り付ければ良いのか分からず
とにかく</HEAD>の前に貼り付けたら「エラーが発生しました」と出て表示されませんでした。

直接タグを貼り付けるのもスタイルシートで設定するのも
結果としては同じ事なのでしょうか？
もしもタグを貼り付ける方法でなら編集中に画像が表示されるなら、
そちらでやりたいと思っています。

タグを貼り付けるやり方の手順を具体的に教えて頂ければ幸いです。

Re: 画像の固定について ( No.3 )

日時： 2006/02/08 21:12
名前： Newのり太

> 実は最初は御回答にもありました固定タグを貼り付ける方法でやっていたのですが、

あ、いや、先ほどのスタイルシートの記述は、
HPBのスタイルシートマネージャーで設定したものをそのままコピペしたものです。

> 直接タグを貼り付けるのもスタイルシートで設定するのも
> 結果としては同じ事なのでしょうか？

まあ、スタイルシートの書式は決まってますんで、だいたい同じようなものになります。
ただ、細かいところは、人それぞれ癖（？）がありますので、多少違う場合もあります。
たとえば、プロパティを続けて書くとか、: や、; の前後のスペースの空け方とか、
省略できるところは省略したり、たとえば、スタイルシートマネージャーでやると
○○{
border-width : 1px 1px 1px 1px;
border-style : solid solid solid solid;
border-color : black black black black;
}
↑こうなるところ、
○○{
border : 1px solid black;
}
と省略できたりしますし、

○○{
margin-top : 1em;
margin-left : 0;
margin-right : 0;
margin-bottom : 1em;
}
↑となるところ、
○○{
margin : 1em 0;
}
と省略できたりもします。
スタイルシートマネージャーですと、このあたりが<del>バカ</del>丁寧になりがちですが、
言ってることは同じですので、ブラウザでの表示は同じになるはずです。
同じにならなければ、CSSの仕様どおりに表示できないブラウザのせいです。

> もしもタグを貼り付ける方法でなら編集中に画像が表示されるなら、
> そちらでやりたいと思っています。

スタイルシートマネージャーで設定するにしろ、コピペするにしろ、
ソースに正しく記述されているのに編集画面で表示されない
ということでしたら、ちょっと原因はわかりません。
前述のように、スタイルによっては編集画面に反映されないこともありますが、
背景画像の表示ぐらいならHPBは対応出来ているように思います。

自分の場合（ver6.52）は、スタイルシートマネージャーで
位置をいじくっているうちに background-position の指定が消えてしまうだけで
再度設定したり、ソースに直接書けば編集画面にも反映されるんですよー。
# よく考えたら全然現象が違いましたね。失礼。

背景のスタイルを一度削除してあらためて設定したりしてみては？

> タグを貼り付けるやり方の手順を具体的に教えて頂ければ幸いです。

やり方は、ソースを開いて適切な位置に・・・ってことじゃないですよね。
「適切な位置」を判断する方法を聞いておられるんでしょうけど、
それには、やはり、CSSの書式と意味を理解されるのが
遠回りのようでも結局近道で最も確実のような気がします。
なんと言いますか、やっぱりある程度ケースバイケースになってくると思いますんで。。。

> <HEAD>と</HEAD>の中に貼り付けると幾つかの素材配布サイト様で見たのですが、
> その中には他のタグがあってどこに貼り付ければ良いのか分からず
> とにかく</HEAD>の前に貼り付けたら「エラーが発生しました」と出て表示されませんでした。

スタイルシートを書く場所は、<head></head>間とは限りません。
外部ファイルにしたほうがいい場合もありますし、タグのstyle属性に書く場合もあります。
前言とかぶりますが、やはり、自分で判断できるようになるには
多少の知識、慣れといったものが必要になってくるのではないかと思います。

キレイに表示されているページでも、ソースを見たら、
「方々からコピペしまくりました」とわかるページはたくさんあります。
セレクタが重複していたり、ナニかが抜けていたり、余計だったり、
不可解な記述がされているからです。
それでも一応意図したように表示されるかもしれません。
でも、出来ることなら、なるべくシンプルでキレイなソースを書きたいですよね。

Re: 画像の固定について ( No.4 )

日時： 2006/02/08 21:16
名前：うり

Newのり太様、再びの御回答、本当に有難うございます。
やはり今の私ではまだ知識も経験も不足していて、
ソースをいじっていくのはまだ難しいと思いました。
御回答を参考に、これから勉強していきます。
未熟な質問にお答え下さり、本当に感謝しております。

それで、画像を固定させるのは今の所はスタイルシートマネージャーで
やっていこうと思うのですが、
先程その「プレビューでは表示されるのに編集中は表示されない」ページを確認したところ、
テキストの位置がプレビューとネット中とで違っていました。
サイズではなく、位置自体が全体に下にずれています。
これは今までの質問内容とはまた別の事が原因でしょうか？

var.９で、どこでも配置モードで作ったページです。
他の方の質問に、どこでも配置モードだとそういう問題が発生するとあったので、
それが原因かと思うのですが、これは編集中に画像表示がされない事と
何か関係があるのかとも思いまして。

何度も申し訳ありません、教えて頂けると嬉しいです。
どうぞよろしくお願いします。

Re: 画像の固定について ( No.5 )

日時： 2006/02/08 21:24
名前：うり

申し訳ありません、追記です！

＞背景のスタイルを一度削除してあらためて設定したりしてみては？

スタイルシートマネージャーの設定を一度削除するという事でしょうか？
もしそうなら、やってみたのですが、
そうすると編集中に画像が表示されました。
もう一度左下に固定させるとまた消えます。

Re: 画像の固定について ( No.6 )

日時： 2006/02/08 21:53
名前： Newのり太

あ～、「どこでも」ですかぁ。

それなら当方の環境でも編集画面では表示されません。
垂直方向「上」や「中央」なら表示されますが、「下」だけは表示されませんね。
「中央」でもやや下にずれた位置に表示されます。
「下」の場合、たぶん画面のはるか下のほうに隠れてしまっているのかも。

おー、いわゆる「ページサイズ」を小さくすると現れますたー。ｗ

これはおそらくどこでも配置モードの仕様ではないかと思います。

> ＞背景のスタイルを一度削除してあらためて設定したりしてみては？

これは上記の理由で有効な手段とはならないようです。
標準モードでおつくりになれば万事解決です。

どこでも配置モードがダメな理由。
https://hpbuilder.net/dokodemo-mode.htm

>> やはり今の私ではまだ知識も経験も不足していて、
>> ソースをいじっていくのはまだ難しいと思いました。

ん～、基本さえわかってしまえばそう難しいもんでもないかもしれないんですけどね。
｜HTMLは簡単だけど
｜ホームページは難しい
｜-----と息子は言った
https://www.asahi-net.or.jp/~sd5a-ucd/www/

Re: 画像の固定について ( No.7 )

日時： 2006/02/08 22:48
名前：うり

Newのり太様、御回答有難うございます。
やはり画像が表示されないのは「どこでも～」が原因のようです、
ご指摘の通り、ページサイズを変えると出てきました！
表示されていないと思っていましたが、よ～～く見ると、
遥か下にかすかに画像の頭が出ていました。
もっと早く気づくべきでした、すみません‥
表示されていないように思えただけなのですね。
大切な事を書き漏れていたせいでお手数をおかけしてしまい、申し訳ありません。

先程標準モードでページを作り直してみたところ、編集中もプレビューも
普通に表示されました。有難うございます、謎が解けました。とてもすっきりしました。
が、やはりテキストの位置が、プレビューで見た時よりネットで見た時の方が全体に下にずれています。
フレームを使っているからかと思うのですが‥上下で分割していて、ちょうどその分割幅くらい下にずれているようなのです。
これはまた別の原因でしょうか？
だとしたら別のスレを立てるべきなのですよね。
すみません。
何度も申し訳ありませんが、御回答頂けると幸いです。

Re: 画像の固定について ( No.8 )

日時： 2006/02/08 23:26
名前： Newのり太

> だとしたら別のスレを立てるべきなのですよね。

その方がいいかもしれません。
その際には、問題のページのURLを提示して、
どこがどうなのでこうしたいという風に質問されると
より具体的な回答を得られるかもしれません。

自分はもう寝ますけど。

Re: 画像の固定について ( No.9 )

日時： 2006/02/08 23:30
名前：うり

Newのり太様、有難うございました。
自分で色々やってみて、分からなければまたこちらにお力を借りにきたいと思います。
画像の表示の件は分かりました、何度も有難うございました！

ホームページビルダー・グレート初心者講座