文字色を変える方法

■HTMLで変える方法
入力例
<font color=”#ff00ff”>文字色を変えたい文字列</font>

・直接入力
タグをコードビューで打ち込むのがツールの使い方を覚えるより楽な気もしますが、簡単な入力ツールの使い方も後で書きますのでお待ちを。
これは簡単に説明するとこれは#を先頭にカラーコードを””の間に入力し文字色を変えたい文字列に着色した状態です。これは紫色になります。

・クイックタグ編集とカラーピッカーを使う方法
①分割ビューにする
②デザインビューの方で文字色を変えたい文字列を範囲選択する。
③「CTRL」キーと「T」キーを同時に押し、クイックタグ編集を起動。
④fontと入力し「ENTER」キーで確定する
⑤スペースキーを押した後、colorと入力し「ENTER」キーで確定する
⑥もう一回「ENTER」キーを押してクイックタグ編集を閉じる。
⑦コードビューで””の間をクリックし「CTRL」キーと「スペース」キーを押す。
⑧カラーピッカーで色を選択する。
⑨画面の関係ないところをクリックすると文字に色が付いている。

■CSSで変える方法
自由度の広いこととSEOの観点からできれば外部CSSで変えた方がよいでしょう。
・HTMLファイルの入力例

<span>フォントカラー指定文字列</span>

・CSSファイルの入力例(メイリオで表示)

@charset “utf-8”;
.mojicolor {
color: #F0F;
}

手順の例
・CSSの設定
①画面右中段CSSスタイルパネルで「新規CSSルール」をクリック
②「新規CSSルールダイアログ」で「セレクタータイプ」をクラス、「セレクター名」をmojicolor、ルール定義を新規スタイルシートファイルにし(既存のスタイルシートファイルに追加したいときは既存のファイルを指定)、「OK」ボタンを押す
③「スタイルシートファイルの別名で保存」ダイアログでCSSファイルに新しく名前を付けて作成・保存する。
④カテゴリ「タイプ」で「Color」を指定
⑤フォントの色を指定したらOKを押す。
・HTMLの設定
⑥デザインビューでフォントを変えたい文字列を範囲選択
⑦プロパティインスペクタのクラスでmojicolorというCSSで設定したクラス名を選択
⑧フォントが反映される。

広告

関連コンテンツ

コメントは受け付けていません。

サブコンテンツ

このページの先頭へ