Q&A
ご回答ありがとうございます。
そうなのですね、参考にさせていただきます。
実現したいこと
このような九九表で1~9の数字に半角スペースをつけて二桁の数字と行を揃えたいです
起きている問題
一桁の数字だけに空白をつけることができないです
試したこと
ifを使って9以下の数字を条件として、str_pad()などで空白を付けようと試みたのですが、うまくいかずでした。
該当のソースコード
php
1<?php 2echo '<table>'; 3for($i = 1; $i <= 9; $i++) { 4 echo '<tr>'; 5 for($s = 1; $s <= 9; $s++) { 6 $num = $i * $s; 7 echo '<td>'; 8 echo ' '.$num; //ここの空白は全角空白です 9 echo '</td>'; 10 } 11 echo '</tr>'; 12} 13echo '<table>'; 14
以上です。
わかる方がいらしたらご回答よろしくお願いします。
回答3件
0
ベストアンサー
1~9の数字に半角スペースをつけて二桁の数字と行を揃えたいです
ふつうにHTMLを出力した場合、スペースを入れても揃いません。
<td>にtext-align: rightをかけてスタイルシートで処理するのが手っ取り早いですし適切です。
投稿2020/10/23 07:43
総合スコア146018
0
レイアウトの話ですので、PHP度外視でHTMLを組んでから（”モック”と言います）、PHPよりその通りのHTMLを出力するようにしてください。
例えスペースを入れたとして、桁が増えればずれます。そのたびに「最終桁」から「出力する値」の桁数を計算してスペースを入れるのは現実的ではありません。フォントも影響するのでPHPの機能だけでレイアウトをどうにかしようとするのはそもそも間違いですし、「揃う」ことはありません。
ちなみに半角スペースはHTML上でその通りに出ることはないです。
強いてなら (HTMLエンティティ) の利用
ですが、結局これはHTMLの話でありPHPの話ではありません。
投稿2020/10/23 07:47
編集2020/10/23 07:58
総合スコア80875
定型的なコメントのようなので、何について「そうなのですね」と言っているのか、どこまで理解されたのか分かりませんが、
Webブラウザから実行するアプリケーションを作る限りはHTMLを最低限以上身につけていおかないことにはどうにもならないと思います。
ご教示いただいたことを理解した上で「そうなのですね」と言っています。
ですが、確かにその通りなので次回の質問からはある程度気を付けようと思います。ご親切にありがとうございます。
PHPの機能でレイアウトを操作することはナンセンスということもしっかり理解できました。
僕自身PHPをやる上でHTMLは完全にとまではいきませんが、HTMLの技術も身につけているつもりですが、今回のことに関しては理解漏れがあったのでそこについてはしっかり学習し直します。
PHPでレイアウト操作はそもそもできませんよ。ブラウザ上で確認する以上、HTMLです。回答の最後に書いたとおり。
Webはそのあたりの感覚を確実に分かってないとかなり厳しいと思います。(teratailの質問者には非常に多い)
0
半角スペースではHTML上の表示は基本的に変わりません。
見た目に関しては他の回答通りCSSで対応する（か、0で揃えるとか）方が正しいです。
（見た目に関わる文字列をHTMLの中に入れてしまうと、HTMLの文書としての正しさが損なわれます）
が、どうしても半角スペースで揃えたいのであれば、半角スペースのHTMLエンティティである
を指定することで半角スペースとして描画してくれるので、
PHPでそうなるように出力すれば可能です。（str_pad()では出来ないので、表示する箇所で9以下の整数であることを判定して文字列として追加するような形ですね）
例）以下のHTMLをそれぞれブラウザで開いてみて表示を確認してみてください。
HTML
1<html> 2 <body> 3 <table> 4 <tr><td> 1<td></tr> 5 <tr><td>10<td></tr> 6 </table> 7 </body> 8</html>
↓
HTML
1<html> 2 <body> 3 <table> 4 <tr><td> 1<td></tr> 5 <tr><td>10<td></tr> 6 </table> 7 </body> 8</html>
投稿2020/10/23 08:08
編集2020/10/23 08:10
総合スコア18727
昔は大量に 投入して調整とか平気でやってましたよね・・
今は１つでもあるとモヤっとする。
> 昔は大量に 投入して調整とか平気でやってましたよね・・
私も覚えがありますｗ
CSSの互換性も微妙でしたしね。
> 今は１つでもあるとモヤっとする。
「文字列としての半角スペースを表示しないといけない時」となると固有名詞とかアルファベットの熟語とかですかね。
ライセンス表記をHTML内でする時とかはありそうな気もします。
間に入るような
Copyright © hogehoge
のところくらいなら英文の単語区切りレベルなので半角スペースでやるかもしれません。
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/10/23 07:45
2020/10/23 07:47
2020/10/23 07:51
2020/10/23 07:56 編集
2020/10/23 08:00
2020/10/23 08:00