HTML と CSS の強調引用(blockquote)
引用と著者を書き、スタイルと色を選びます。プレビューには、文章の途中に置いた引用が表示されます。
使い方読者を引き込む一言
広告
HTML と CSS の強調引用(blockquote): 用途
お客さまの声、インタビューの抜粋、記事の要点など、本文の途中にある一言を目立たせます。引用、著者、肩書きを書き、5つのスタイル(左線、大きな引用符、カード、大きな中央寄せ、カラーバンド)から選び、好みの強調色とフォントを設定します。
コードは、引用と著者をセマンティックにマークする figure、blockquote、figcaption を使い、cite 属性には出典のアドレスを指定できます。プレビューは、実際の記事のように、2つの段落の間に置いた引用を表示します。
使い方
- 引用と著者を書きます。
- スタイル、色、フォントを選びます。
- コードをサイトにコピーします。
使うタイミング
- トップページで強調するお客さまの声。
- ブログのインタビューの抜粋。
- 記事の途中のキャッチフレーズ。
よくある質問
blockquote と q の違いは何ですか?
blockquote は、このツールが作るような、本文から独立したブロックの引用に使います。q は文の中の短い引用に使い、ブラウザが引用符を自動で付けます。
著者を正しく示すには?
引用を figure で囲み、生成されたコードのように、すぐ下の figcaption に著者を入れます。著者の名前は、発言の一部ではないので blockquote の中に入れません。引用がページから来た場合は、そのアドレスを cite 属性に指定します。
お客さまの声として使えますか?
使えます。強調したいお客さまの声に使ってください。実際の発言を、本人の許可を得て使います。複数の声をまとめて載せる場合は、サイト用のお客さまの声ジェネレーターを使ってください。
本当に無料?
はい、100%無料です。登録不要、サブスクなし、利用制限なし。すべてのツール:Tools123は無料です。