JavaScript を使用せずに表のセル全体からハイパーリンクを作成するにはどうすればよいですか?

表のセルからハイパーリンクを作成する

このタスクは、次の HTML マークアップを機能的なハイパーリンクに変換することです:

<td>
  some text
  <div>a div</div>
</td>

目標は、JavaScript に頼らずにテーブル データ セル全体 () をクリック可能なリンクに変換することです。

推奨される方法: CSS ベースのアプローチ

全体を直接リンクしている間、要素は意味的に正しくありません。回避策が存在します。 内のコンテンツを拡張することで、

<td>
  <a href="http://example.com">
    <div>

このアプローチでは、ネストされた

を利用します。これにより、セル全体が占有され、 要素がセルの境界まで効果的に拡張できるようになります。

代替アプローチ (推奨されません)

Internet Explorer のみをサポートする環境の場合非標準のメソッドも使用できますが、HTML 規約に違反します。

<table>
    <tr>
        <a href="http://example.com"><td  width="200">hello world</td></a>
    </tr>
</table>

このアプローチは Internet Explorer ではリンクとして機能しますが、すべての場合無視され、標準のテーブル セルとして表示されます。他のブラウザ。

以上がJavaScript を使用せずに表のセル全体からハイパーリンクを作成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

JavaScript css html for while function this transform table td

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。