WordPressでブロック引用符にスパンタグを使用する方法

スパンタグを使用すると、WordPress投稿の任意のセクションにCSSスタイルを適用できます。それらをカスタムCSSコマンドと見なします。 テキストのセクションを囲むと、これらのカスタムコマンドは「スパン」内のすべてに適用されます。事実上、これにより独自のタグを作成することができます。 このような用途の1つは、テーマのデフォルトのblockquoteコマンドに加えて使用できるユーザー定義のblockquoteタグを作成することです。

1。

WordPress管理者エリアにログインします。 左側のメインメニューから、「外観」をクリックし、「エディタ」をクリックします。これらのオプションが表示されない場合は、「管理者」権限がないためです。 サイトの所有者に連絡してアップグレードを依頼するか、またはこれらの手順を完了するよう依頼してください。

2。

右側のファイルリストから「style.css」をクリックします。 このファイルのコードが中央編集ウィンドウに表示されます。 ファイルの先頭から新しい行を開始してから、次のコードを追加します。

.bq {display:block; 左余白:30px。 左ボーダースタイル:実線。 左ボーダー色:赤。 左パディング:5px。 }

唯一の重要な部分は、 "display:block;"行です。これにより、複数行のテキストをspanタグでスタイル設定できます。 コードの残りの部分では、ブロック引用符を30ピクセルインデントし、引用符の左側に赤い線を配置してから、テキストをその線の右側に5ピクセル配置します。 好みに合わせて新しいコードを編集または追加します。 完了したら、[ファイルの更新]をクリックします。

3。

メインメニューから「投稿」または「ページ」をクリックし、新しいブロック見積もりを追加する文書を選択します。 次のようにして、引用したいセクションをスパンタグで囲みます。

これは私の引用です

4。

画面右上の「更新」をクリックしてから、「ページの表示」をクリックして結果を確認してください。 spanタグは、作成したばかりの“ bq”クラスのすべてのコードをそれらの間のテキストに適用します。 あなたが結果に満足しているならば、あなたは好きなテキストにbq spanタグを適用し続けることができます。 そうでない場合は、style.cssページに戻ってbqクラスを編集してから、もう一度確認してください。 あなたが満足するまで繰り返します。

先端

  • スパンタグはテキストだけに限定されているわけではありません - 通常CSSを適用できるものなら何でもスタイルすることができます。

警告

  • “ style.css”ファイルに加えた変更は、Webサイト全体に即座に適用されます。このファイル内の他のコードを編集しないように注意してください。

人気の投稿