タグ・デザイン掲示板

[

スマートフォンからの表示
by liverty

2015-11-11 04:57
検索してみましたが、解決しそうになかったので質問させていただきます。
見落としで類似した質問があったら申し訳ございません。

現在このようなタグ↓を使っていますが、スマートフォンから見た時に画面が拡大され、横にスクロールするか、ピンチで縮小しないと綺麗に表示されません。
この場合、スマートフォンから見ても拡大されずに閲覧する方法はありますでしょうか？

回答お待ちしております。

<br/><br/><div align="center"><table border="0" bgcolor="#ffffff" cellspacing="<nopc>4"</nopc><pc>20" width="480"</pc>><tr><td>
<font size="5">ここに文字</font><div align="right"></div>
<br/>
<hr noshade size="0" color="#999999" /><br/><div align="right">ここに文字</div><hr noshade size="0" color="#999999"/>

pc
[編集]

by 匿名

2015-11-11 15:02
タグミス多いので少しご自身で勉強して変えたほうがいいです

タグのことが判らないのであれば、公式の物をつかってみてください

pc
[編集]

by おもち

2015-11-16 13:57
もし、ページ幅を設定する為だけにテーブルタグを使っていらっしゃるようなら、<div style="">～</div>に置き換えた方がデザインの幅は広がると思います。

<br/><br/>
<div align="center"
style="max-width:480px;">
<font size="5">ここに文字</font>
<div align="right">～</div>
<br/>
<hr noshade size="0" color="#999999" /><br/>
<div align="right">ここに文字</div>
<hr noshade size="0" color="#999999"/>
</div>
スマートフォンから閲覧した際に横スクロールが出てしまうのは、テーブルタグ内で横幅を480pxに固定してしまっている為です。スマートフォンはpc扱いなので、<pc>～</pc>で括ったwidth:480pxが適用されてしまい、スマートフォンの画面幅が480pxよりも狭い為、横スクロールが発生しているものと思われます。

レスポンシブWEBデザイン、media screenで検索すると幸せになれるかもしれません。本来はHEAD内にcssを使って設定します。

動作確認はしていませんのできちんと動くかは不明ですがお試し下さい。

pc
[編集]

by liverty

2015-11-17 01:32
匿名さん>>初心者ですので、テンプレートを使わせて頂いておりました。
当方も色々とネットで検索してみたもののよく分からずこちらなら回答が得られるかと思い質問を投稿してみましたが、もう少し勉強してみようと思います。

回答ありがとうございました。

pc
[編集]

by liverty

2015-11-17 01:57
おもちさん>>説明不足でした。

背景に画像を設定しているのですが、PCから閲覧すると、画面で

│　　　│
│　□　│
│　　　│

このように表示されます(□がテーブルとしています)
テーブルの左右や、上下に背景として使っている画像が表示されている状態です。

しかし、スマートフォンでページを閲覧すると、

├──┤
├──┤
│　　│

このように、テーブルが横に広くなってしまい、テーブルの左右に背景が表示されない状態です。

これをスマートフォンから閲覧してもPCと同じように上下左右に背景が表示されるようにしたかったのでここで質問してみました。

回答で頂いたタグ、試してみます。併せてレスポンシブWEBデザイン、media screenも検索しようと思います。
詳しい回答ありがとうございました。

pc
[編集]

[