次は、記事の文字にHTMLコードを使ってマーカーを引く方法をします。

記事の文字にHTMLコードを使ってマーカーを引く方法

ワードプレスの管理画面を開きます。

左上の「投稿」を押します。

左上の「新規追加」を押します。

左上の「タイトルを追加」「記事の文字にHTMLコードを使ってマーカーを引く方法」と入力します。

右側の「テキスト」を押します。

テキストのところに、HTMLコードを貼り付けます。

テキストのところに、下記コードをコピーして貼り付けます。

<span style="background-color: yellow;">蛍光マーカー黄色</span>

貼り付けました。

右側の「公開」を押します。

「OK」を押します。

右上の「変更をプレビュー」を押します。

「蛍光マーカー黄色」の文字に黄色のマーカーが引かれていることを確認します。

↑じょうまさふみに学習状況を報告すると喜びます(^^)/

HTMLコードの説明

今回、マーカーを引くために使ったbackground-colorタグの説明をします。

背景の色を変えるために使うHTMLタグです。

<span style="background-color: yellow;"></span>で文字を、はさみます。

background-colorタグ記入例

<span style="background-color: yellow;">蛍光マーカー黄色</span>
<span style="background-color: pink;">蛍光マーカーピンク色</span>
<span style="background-color: greenyellow;">蛍光マーカー黄緑色</span>
<span style="background-color: aqua;">蛍光マーカー水色</span>

記事をプレビュー表示したとき

蛍光マーカー黄色
蛍光マーカーピンク色
蛍光マーカー黄緑色
蛍光マーカー水色
講座1の関連記事
  • アイコンを光らせるHTMLとCSSを使ってする方法
  • ボタンの色を変えるCSSコードを追加する方法
  • アイコンの色を変えるCSSコードを追加する方法
  • 記事にアイキャッチ画像を設定する方法2
  • Brainを使ってお金を稼ぐ方法(紹介記事の書き方)
  • ブログタイトル名と説明文の変更2
おすすめの記事
講座1
次は、ファビコン設定をします。 ファビコンとは? ファビコンとは、自分のブログのアイコン画像のことです。 インターネットでサイトやブログを開...
講座1
次は、ブログデザインの変更をします。 ブログデザイン変更 作業手順 ワードプレスの管理画面を開きます。 左側の「Cocoon設定」を変更しま...
講座2
講座の進め方 動画 動画の目次 00:35 無料サーバーデメリット 01:30 講座の進め方 02:10 タスク注意事項 03:00 講座の...