ホームページ >ウェブフロントエンド >CSSチュートリアル >XHTML 1.1 への準拠を維持しながら Div 要素をクリック可能にするにはどうすればよいですか?

XHTML 1.1 への準拠を維持しながら Div 要素をクリック可能にするにはどうすればよいですか?

DDDオリジナル: 2024-12-23 11:03:43655ブラウズ

How Can I Make a Div Element Clickable While Maintaining XHTML 1.1 Compliance?

XHTML 1.1 準拠で Div をクリック可能なリンクに変える

視覚的に豊かな

を変換する必要性既存のコンテンツを変更せずに要素をクリック可能なリンクに追加することは、さまざまな Web 開発シナリオで発生します。

をラップする単純な方法は、内で

有効な XHTML 1.1 ソリューションの実装

この課題に対処するには、より複雑なソリューションが必要です。 XHTML 1.1 準拠を維持します。

を直接ラップする代わりに、 < が付いている

デフォルトのリンクを作成します:
内にリンク要素 () を配置します。これは要素全体のプライマリリンクとして機能します。

空のスパンを挿入します。 内に

要素の位置: 「position:relative;」を割り当てます。

へ

スパンの CSS: 次の CSS プロパティを空のスパンに適用します:

{ 
  position:absolute; 
  width:100%;
  height:100%;
  top:0;
  left: 0;

  z-index: 1;

  /* fixes overlap error in IE7/8, 
     make sure you have an empty gif */
  background-image: url('empty.gif');
}

この CSS は、次のことを保証します。スパンは

全体をカバーします。クリック可能なリンクとして機能し、ユーザーのアクセシビリティを強化し、XHTML 1.1 準拠を維持します。

以上がXHTML 1.1 への準拠を維持しながら Div 要素をクリック可能にするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

css xhtml for while include default this position transform

声明：

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

前の記事：Div でクロスブラウザーのワードラッピングを実現するにはどうすればよいですか?次の記事：Div でクロスブラウザーのワードラッピングを実現するにはどうすればよいですか?

続きを見る