ホームページ >ウェブフロントエンド >CSSチュートリアル >JavaScript を使用せずにクリック可能な Div を作成するにはどうすればよいですか?
JavaScript を使用しないクリッカブル Div
JavaScript を使用しないクリッカブル Div の作成には課題が生じます。これは、div のようなブロック要素を次のようなインライン要素内に配置できないためです。アンカー。これを克服するための賢いアプローチは、CSS を使用してクリック可能な div の錯覚を作成することです。
CSS と HTML を使用した解決策
CSS:
#my-div { background-color: #f00; width: 200px; height: 200px; } a.fill-div { display: block; height: 100%; width: 100%; text-decoration: none; }
この CSS は、背景が赤い固定サイズの div (#my-div) を定義します。また、div 全体を占めるアンカー要素 (a.fill-div) も定義します。
HTML:
<div>
HTML は、「my-div」という ID を持つ div を作成し、その中に「fill-div」というクラスを持つアンカー要素を作成します。アンカー要素は div 全体を占めるため、div 内の任意の場所をクリックすると、アンカーの href リンクがアクティブになります。
これらの CSS 要素と HTML 要素を組み合わせることで、div 全体をクリック可能にすることができます。 JavaScript を使用しないクリック可能な div の外観。
以上がJavaScript を使用せずにクリック可能な Div を作成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。