summaryの使い方についてまとめ

summaryの概要

summary要素はdetails要素の概要を表します。summary要素をクリックすると親要素であるdetails要素の開閉状態を切り替えることができます。

注意点

summary要素はdetails要素の最初の子要素としてのみ使用できるタグです。

summaryのカテゴリー

コンテンツカテゴリー

  • コンテンツカテゴリなし

    コンテンツモデル

    • コンテンツモデルなし

summaryに入れられるタグ一覧

タグ早見表

フレージングコンテンツ、またはひとつのヘッディングコンテンツ

入れられるタグのカテゴリー・モデル

summaryに使える属性

属性とは<summary> タグ内に入れることのできるものです。属性をあてはめることにより、CSS・JavaScriptなどで操作する際に識別させることが可能になります。

よく使うグローバル属性

id 概要 要素に対してID固有の識別名を付けることができます。
属性の値 英字から始まる英数字
class 概要 要素に対して分類名を付けることができます。
属性の値 英字から始まる英数字
style 概要 要素に対して直接スタイルを指定することができます。
属性の値 スタイルシートのコード

スポンサードサーチ

<summary>の使い方

ブラウザ対応状況

ブラウザの対応(PC)
Chrome あり
Safari あり
Internet Explorer なし
Edge なし
Firefox あり
Opera あり
ブラウザの対応(SP)
Chrome あり
Safari なし
Samsung Internet あり

WORK REQUEST

CONTACT