News

Home News よくあるご質問

よくあるご質問

質問お題に対する答え解説を一覧で表示する際のスタイル。

dl要素の中に、dt要素dd要素をセットにしたdiv要素を並べる構造。
dl要素にクラスc-faqを付与し、div要素にはクラスfaq_item、dt要素にクラスfaq_q、dd要素にクラスfaq_aを付与する。

表示サイズを確認するためのサンプルテキスト
この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。
だいたい20文字くらいのサンプルテキスト
この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。
表示サイズを確認するためのサンプルテキスト
この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。
<dl class="c-faq"> <div class="faq_item"> <dt class="faq_q">表示サイズを確認するためのサンプルテキスト</dt> <dd class="faq_a">この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。</dd> </div> ︙ </dl>

コンポーネント「アコーディオンUI」と組み合わせると動きある実装となる。

表示サイズを確認するためのサンプルテキスト
この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。
だいたい20文字くらいのサンプルテキスト
この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。
表示サイズを確認するためのサンプルテキスト
この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。
<dl class="c-faq"> <div class="faq_item js-accordion"> <dt class="faq_q acc_head">表示サイズを確認するためのサンプルテキスト</dt> <dd class="faq_a acc_body">この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。この文章は、表示サイズを確認するための、40文字くらいのサンプルテキストです。</dd> </div> ︙ </dl>