見出しタイトルの下のテキストを自動的に非表示にする

ユーザーが簡単に閲覧できるように、できるだけ多くの質問が見えるFAQトピックを用意したいと思います。そのための1つの方法は、回答のテキストを非表示にし、質問をクリックすると回答テキストが表示されるようにすることです。

これは、モバイル版Wikipediaのインターフェースの動作に似ています。

以下に他の例を示します。

これを実現する1つの方法としてdetailsを使用できます。

しかし、私の知る限り、detailsのヘッダーテキストにはスタイリングがサポートされていないため、目立たせるのが難しいです。

私が望むのは、質問を見出しにし、見出しテキストをクリックするとその下のテキストが表示されるようにすることです。

これは簡単に実現できますか?私はホスティングプランを利用していることに注意してください。

以前はマークダウンの代わりにHTMLを使用して、ある程度の成功を収めていましたが、改行の問題を回避するために<h3>の代わりに<big>を使用し、それでも大きなタイトルを付けていました。このようになります。

<hr>
<details>
<summary>
<big> Question </big>
<hr>
</summary>

This is an answer

<hr>
</details>

<details>
<summary>
<big> Question </big>
<hr>
</summary>

This is an answer 

<hr>
</details>

<details>
<summary>
<big> Question </big>
<hr>
</summary>

This is an answer

<hr>
</details>

Question

This is an answer


Question

This is an answer


Question

This is an answer


「いいね!」 7

素晴らしい!これで完璧です。ありがとうございます。

「いいね!」 3

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.