スタイルシートをホームページやブログに適用するためにはデザインを考えてページに組み込むことが必要です。
文字サイズや文字の背景色、ページ全体の背景色・画像などページ全体にスタイルを適用するものと部分的に適用するものとで使用するタグ要素が異なります。
そのタグや要素の記述方法について基本をしっかり習得しておくことが大事だと思います。種類がたくさんありますので覚えるのが大変ですが、基本的な数種類を覚えておくだけでもサイトを構築するために役立ちますし効率化が図れます。
慣れてくれば徐々に身に付いてくると思うので心配はいりません。完璧性を求めていてはサイト構築は程遠く先の先になってしまいます。マニュアルを見ながらでも先に進めていくことをお勧めします。
スタイルシートの基礎編 メニュー
- スタイルシートの基礎「文字の大きさを変える」「文字の色を変える」記述方法‐HTML・CSSを学ぶ
- スタイルシートの基礎「文字の太さを変える」「文字の種類を変える」記述方法‐HTML・CSSを学ぶ
- スタイルシートの基礎「文字の背景色を変える」「文字を斜体に変える」記述方法‐HTML・CSSを学ぶ
- スタイルシートの基礎「文字を囲む枠線を使用する」「枠線と文字の間に余白を設ける」記述方法‐HTML・CSSを学ぶ
- スタイルシートの基礎「文字に下線を引く」「下線にスタイルを適用する」記述方法‐HTML・CSSを学ぶ
- スタイルシートの基礎「リストを作成する」「リストにスタイルを適用する」記述方法‐HTML・CSSを学ぶ
- スタイルシートの基礎「画像を挿入する」記述方法‐HTML・CSSを学ぶ
- スタイルシートの基礎「挿入した画像の位置を決める、文字を回り込ませる」記述方法‐HTML・CSSを学ぶ
説明でプロパティと値については次のページで説明しています。
文字の背景色を変える
文字の背景色を変えると強調したり目立たせることができます。プロパティと値の部分になります。
background-coloe: yellow; 、background-coloe: lime; など
ブロガーBloggerでは文字の背景色を変えるためのツールが用意されています。
ブロガーBloggerのツールを使用して文字の背景色を変える方法
文章の中で文字の背景色を変えたい部分の文字を選択します。
「文字を入力します。」で説明します。
「文字を入力します」の先頭部分からマウスを左クリックして、クリックしたまま最後の「します。」までカーソルを移動させると文字を選択できます。
選択した個所は青く色付けされています。
文字を選択した状態でツールバーの鉛筆マーク「テキストの背景色」をクリックします。
色の選択画面が表示されるので文字色に合った好みの背景色を選択します。文字が引き立つように選択すると良いと思います。
「文字を入力します。」 「色の選択」でyellowを選択。
文字を斜体に変える
文字を斜体に変えるとサイトの持つイメージが変わってくると思います。
一部分に適用させる場合や全体に適用させる場合が考えられますが手紙ならともかく、ホームページやブログでは一部分のみの適用に留めておきましょう。
プロパティと値の部分になります。
font-style: italic;
ブロガーBloggerでは文字を斜体に変えるためのツールが用意されています。
ブロガーBloggerのツールを使用して文字を斜体に変える方法
文章の中で文字を斜体に変えたい部分の文字を選択します。
「文字を入力します。」で説明します。
「文字を入力します」の先頭部分からマウスを左クリックして、クリックしたまま最後の「します。」までカーソルを移動させると文字を選択できます。
選択した個所は青く色付けされています。
文字を選択した状態でツールバーの「I斜体」をクリックします。クリックすると文字が斜体表示になります。
「文字を入力します。」
残念ながら文字の表示は変わりませんでした(´;ω;`)。
文字の種類変更でも同じような状態でしたが、これはブログのテーマで基本的なスタイルが定められていて、文字が標準に指定されていると思われます。
調べてみればいいのですが、そこまでの余裕がないので次回に検証してみたいと思います。
0 件のコメント:
コメントを投稿