タグ別アーカイブ: HTML

iPhoneで電話番号リンク問題の対処方法まとめ


iPhone の Safariは連続する数字が勝手に電話番号のリンクになってしまいます。
電話番号や郵便番号(123-4567)のようなハイフン区切りだけでなく、
小数点(123.4567)のようにドット区切りの数値までも電話番号リンクになります。

これでは困るので対処方法をまとめました。
(iPhone 4, iPhone 4sで動作確認)

目次:

  1. 1.iPhone 版 Safari用の対策
  2. 2.Safari以外のアプリ用の対策
  3. 3.修正できないアプリ用の対策

続きを読む iPhoneで電話番号リンク問題の対処方法まとめ

HTML で空白文字列がデザインを崩す


– ソース整形で空白文字(空白、改行、タブ)をいれてたらデザインが微妙に崩れ、原因究明に手間取ってしまった。

   <td>
       <a href=’foo.html’
            alt=”foo”>
          foo
       </a>
   </td>

– TD タグや A タグなど、子要素でなくデータをとる系のタグでは、空白文字は無視されず、表示されてしまう。
– SGML では、全ての空白文字は無視されず、解釈の対象になるのが基本。ただ、全てが解釈されてしまうとコード整形ができなくなるので不便ということで、タグ、要素、属性間で部分的、意図的に無視するようになっている。開始タグの途中の改行も、親がデータ系なら表示されてしまう事になる。データを持つタグの中で無理に整形したいならコメントタグを使って、コメントとして改行するとか工夫しないとだめ。スマートに済ませるなら、データを持たないタグだけで改行する。

  <!– コメントを使って無理矢理(見目悪っ) –>
  <tr>
      <td><!–
          –><a href=’foo.html’ alt=”foo”><!–
             –>foo<!–
          –></a><!–
      –></td>
  </tr>
  <!– または –>
  <tr>
      <td><a href=’foo.html’ alt=”foo”>foo</a></td>
  </tr>
  <!– これは不要な空白が表示されるパターン –>
  <tr>
      <td>
          <a href=’foo.html’>foo</a>
      </td>
  </tr>
  <!– これも –>
  <tr>
      <td><a
           href=”foo.html”>foo</a>
      </td>
  </tr>
  <!– これは多分大丈夫?? –>
  <tr>
      <td
             align=”center”
             border=”1″
      ><a href=”foo.html”>foo</a></td>
  </tr>

長い開始タグとかをコメントしたくて…