Page 442 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 通常モードに戻る ┃ INDEX ┃ ≪前へ │ 次へ≫ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ ▼CSSの画像が表示されません ウニあたま 04/2/25(水) 23:04 ┗Re:CSSの画像が表示されません むむりく 04/2/26(木) 0:09 ┗できたあぁ〜〜!! ウニあたま 04/2/26(木) 1:48 ┗Re:できたあぁ〜〜!! むむりく 04/2/26(木) 2:54 ┗Re:できたあぁ〜〜!! ばあど 04/2/26(木) 9:17 ─────────────────────────────────────── ■題名 : CSSの画像が表示されません ■名前 : ウニあたま ■日付 : 04/2/25(水) 23:04 -------------------------------------------------------------------------
こんにちは こちらのサイトで勉強しながらなんとかサイトが形になってきました。 あちこちの素材屋さんに置いてある壁紙を頂いて使っているのですが、スタイルシート CSSの壁紙(?!)がいくらやっても表示できません。 画像と一緒に「このソースを<head>〜</head>にコピぺして」とソースが書いてある ので、そのままコピぺして、画像ファイルは同じ階層のimgフォルダにアップしてあり ますが、何もナシです。 同じ画像ファイルを<body background="img/・・・で書くと、連続模様に なってしまいます。 パターンを連続表示する壁紙ではなく、一枚のカットなり写真なりを背景として貼り込みたいのですが・・・ なんとか自力で解決をと思って足掻いていましたが、テキストファイルとはなんぞや?! から始めた私は、もう頭がウニで溶けそうです。 どなたか助けて下さい。 |
>画像と一緒に「このソースを<head>〜</head>にコピぺして」とソースが書いてある >ので、そのままコピぺして、画像ファイルは同じ階層のimgフォルダにアップしてあり >ますが、何もナシです。 こんな感じかな? <style type="text/css"> <!-- body{ background-color:#fff; color:#000; background-image:url("img/ファイル名"); background-repeat:no-repeat; background-attachment:fixed; background-position:100% 100%; } --> </style> 1行目に背景の色。 2行目に文字の色。 そして最終行の「100% 100%」の部分を変えてください。 順に上からの位置、左からの位置です。 現在は右下。 中央なら「50% 50%」 左上なら「0% 0%」 |
むむりくさん わずか1時間での速攻レスありがとうございます。 じつは質問を書き込んでからさらにやみくもに(笑)あれこれいぢりまわしていたら、 突然 表示ができました!!! 数か月も足掻いていたのになぜ?! キツネにつままれた気分でこちらにアクセスしたみたら、むむりくさんのコメントが ついていました。 で、やみくもに成功しただけでは進歩しないので、コメントにあったソースをよ〜く 見比べてみて・・・どうやら原因はパスの指定にあった様です。 パスはそのサイトの構成により様々なので当然素材屋さんからコピぺしてきたソース には書かれてなかったんですが、それとは別に「""」がなかったんです。 試しに「""」を消してみたら表示されませんでした。 しかし、パスの指定その他、そこらへんはさんざいぢったハズなんだけどな〜〜、 おっかしいよなぁ〜 となぜ突然成功したのかは謎なんですが、とにかく、表示できた ので一先ずバンザイ!!です。 喜びに勢い余って何枚もただ画像を貼り付けただけのページを作ってしまいました(笑) さて、次なる課題はCSSの外部ファイルなるものなのですが・・・ これがまた、説明読んでもさっぱり・・・(苦笑) またしばらく足掻いてみて、駄目な時にはSOSしにおじゃまします;;; ありがとうございました。 |
>パスはそのサイトの構成により様々なので当然素材屋さんからコピぺしてきたソース >には書かれてなかったんですが、それとは別に「""」がなかったんです。 >試しに「""」を消してみたら表示されませんでした。 不思議ですね。 なんとなく好みでダブルクォーテーション(二重引用符)を入れましたが、 シングルクォーテーションでもいいし、 どちらもなくてもいいはずなのですが。 なんにせよ、表示できてよかったです。 >喜びに勢い余って何枚もただ画像を貼り付けただけのページを作ってしまいました(笑) Σ(´Д`lll) >さて、次なる課題はCSSの外部ファイルなるものなのですが・・・ >これがまた、説明読んでもさっぱり・・・(苦笑) >またしばらく足掻いてみて、駄目な時にはSOSしにおじゃまします;;; 見てもらえるか、分かりませんが… 先程の例ですと、メモ帳に、 body{ background-color:#fff; color:#000; background-image:url("img/ファイル名"); background-repeat:no-repeat; background-attachment:fixed; background-position:100% 100%; } の部分だけを書いてください。 で、適当な名前をつけて保存。 たとえば、「style.css」でhtmlファイルと同じフォルダに置くとします。 次に head 要素内に、 <link rel="stylesheet" href="style.css" type="text/css" charset="Shift_JIS"> と書けば、完成です。 |
>>試しに「""」を消してみたら表示されませんでした。 >不思議ですね。 もしかしたら、偶然バグ持ちのブラウザをお使いだったのかも知れません。 私の知るところでは、 引用符がないと認識されないブラウザ、 単引用符だと認識されないブラウザ、 両方とも存在します。 >>喜びに勢い余って何枚もただ画像を貼り付けただけのページを作ってしまいました(笑) 楽しそぉー いっぺん全部公開してみない?(やめれ >body{ >background-color:#fff; >color:#000; >background-image:url("img/ファイル名"); >background-repeat:no-repeat; >background-attachment:fixed; >background-position:100% 100%; >} 人の好みですが・・・ background:url("img/ファイル名") #fff no-repeat fixed 100% 100%; と短縮可能。順不同。 そして省略可能。省略したら、指定していないのと同じ効果です。 # というのはほんのすこし嘘。 |