MBBSサポート掲示板

[1]

CSS（特に背景）をPC閲覧時のみ反映させたい
山本
2011/1/09 19:24
自分なりに検索してみましたが、納得するご回答が見つからなかったのでスレ立てさせていただきました。

CSSをPCだけに反映させたく、まず下のようなCSSを“□HEAD内編集”に書きました。
↓
<style type="text/css"></style>

確認してみると、自分のイメージ通りのデザインになっていました。
(携帯（ドコモ SH-05A）閲覧時も、<pc></pc>で制限してないのでCSSが反映されている状態です)

これをPCにだけ反映させたいので頭と最後に<pc></pc>を付けましたが、（<pc><style type="text/css"></style></pc>）携帯から確認したところ、携帯（ドコモ SH-05A）にもCSSが反映されていました。（つまり<pc></pc>が機能していないようです）

色々自分なりに試行錯誤した結果、
1.<pc><style type="text/css"></pc></style>　→　PC閲覧時、背景(body)関係のCSSだけが反映されていない。携帯閲覧時も、背景関係以外は反映している。

2.<style type="text/css"><pc></pc></style>　→　PC閲覧時、携帯閲覧時、共に1.と同様の結果。

【疑問その１】→　特殊タグ一覧には“下記のコード #??# をヘッダに挿入する事ができます”と書いてあります。
確かに##の独自タグではないですが、同じ一覧に載っているので<pc></pc>もHEADで使えるものだと解釈しましたが違うのですか？
（因みに上記“”内に書かれているヘッダという語句はリンクになっていますが、クリックしたら“このリンクは無効です”となりました）

【疑問その２】→　だとしたら、どうして書く場所によっては、背景(body)関係だけが反映されなくなってしまうのか？

とにかく、PC閲覧時は壁紙を表示させ、携帯閲覧時は背景を白で表示させたいです。
なので、HEAD内からbody関連のCSSを消し、“共通ページ編集”のヘッダー部分に<pc><body style=""></pc>も試してみましたが壁紙は反映されませんでした。
（一応閉じタグをフッダーの一番最後に付けるというのも試しましたが同様）

HTMLタグ<body background=""></body>だと背景画像の位置指定が出来ず（centerで縦に連続するようにしたい）、思い通りの位置で反映されません。

【一番知りたい質問】→　背景をPCにだけ反映させ、携帯には壁紙なしの白色で表示させる方法について、アドバイスが欲しいです。
テンパっていて、基本的な部分での見落としがあるのかもしれませんが、もう自分では発見できそうにありません。
よろしくお願いします。

pc
[編集] [返信]

[2] ＊KAI＊
2011/1/10 23:21
>>1
私は外部CSSの読み込みでＰＣと携帯の振り分けを行ってます。

フリーページ編集枠にCSSを記述して振り分けたい部分を<pc>～</pc>や<au>～</au>で囲って、

HEAD内に
<link rel="stylesheet" href="CSSを記述したフリーページURL" type="text/css">
を記述するといった具合です。

ご希望に合わない記述方かもしれませんが参考までにm(_ _)m

追記：
特殊タグ一覧に書いてあったﾍｯﾀﾞはおそらく共通ページ編集のヘッダーの事と思われます；

CA005
[編集] [返信]

[3] 山本
2011/1/11 12:56
>>2 * KAI *様

お忙しい中、ご返答くださりありがとうございました。

アドバイス通りにやってみましたところうまくいきました。
CSS内で<pc></pc>などの振り分け独自タグをつかうという発想は私にはなかったものでしたので、大変助かりました。

本当にありがとうございました。

SH05A3
[編集] [返信]

[4] ＊KAI＊
2011/1/11 13:04
連投すみません。

body指定が反映しなかったというところが気になったので自分のBBS試してみました。

やはりbody指定のものは無効化されるようですね…；

背景表示に関しては、
<div>で全体を囲ってそれに背景をつけてあげるのはどうでしょうか。
￣￣￣￣￣￣￣￣￣￣￣
入れ違いで書き込みしてしまったようですね；

無事解決されたようなのでスルーでお願いします。

CA005
[編集] [返信]

[←前][次→]