HTMLのテキストの文字の表示位置を変更する方法として、CSSのtext-alignプロパティを指定することで表示位置を変えられます。 この記事では初心者向けに CSSでテキストの表示位置を左にする方法 CSSでテキストの表示位置を右にする方法 CSSでテキストの表示位置を中央にする方法 について解説をしていきます。 HTMLを学び始めた方でも分かりやすいように、やさしく解説をしますのでぜひ参考にしてみてください！ 目次 1text-alignでテキストの表示位置を左にする 2text-alignでテキストの表示位置を右にする 3text-alignでテキストの表示位置を中央にする text-alignでテキストの表示位置を左にする テキストの表示位置を左に移動させたいときは、CSSでtext-alignを用いて、「left」を指定することで変更出来ます。 以下は、「pタグのテキストの文字を左にする」例です。 HTML <p>このテキストを左に表示したい</p> CSS p{ text-align:left; } text-alignでテキストの表示位置を右にする 一方テキストの表示位置を左に移動させたいときは、CSSでtext-alignを用いて、「right」を指定することで変更出来ます。 以下は、「pタグのテキストの文字を右にする」例です。 HTML <p>このテキストを右に表示したい</p> CSS p{ text-align:right; } text-alignでテキストの表示位置を中央にする 続いて、テキストの表示位置を左に移動させたいときは、CSSでtext-alignを用いて、「center」を指定することで変更出来ます。 以下は、「pタグのテキストの文字を中央にする」例です。 HTML <p>このテキストを中央に表示したい</p> CSS p{ text-align:center; } 以上となります。
-
HTMLのテキストの文字を太字にする方法として、CSSのfont weightプロパティを指定することで文字を太字にすることが出来ます。 この記事では初心者向けに CSSでテキストの文字を太字に変える方法 太字を解除する方法 について解説をしていきます。 HTMLを学び始めた方でも分かりやすいように、やさしく解説をしますのでぜひ参考にしてみてください！ 目次 1font weightでテキスト文字を太字にする 2太字を解除する font weightでテキスト文字を太字にする テキストの文字を太字に変更したいときは、CSSでfont-weightを用いて、「bold」を指定することで変更出来ます。 以下は、「pタグのテキスト文を太字にする」例です。 HTML <p>このテキストを太字にしたい</p> CSS p{ font-weight:bold; } 太字を解除する 一方、既に太字になっているテキストの文字を解除したい、通常に戻したい場合はfont-weightに対して「normal」を指定します。 以下は、「pタグのテキストの太字を解除する」例です。 HTML <p>ここのテキストの太字を解除したい</p> CSS p{ font-weight:normal; } 以上となります。
-
CSSではfont-sizeプロパティを使って、文字の大きさを指定することが出来ます。 この記事では初心者向けに CSSで文字のサイズを変える方法 一部だけ文字サイズを変える方法 について解説をしていきます。 HTMLを学び始めた方でも分かりやすいように、やさしく解説をしますのでぜひ参考にしてみてください！ 目次 1font sizeの使い方 2テキストの一部だけ文字サイズを変える font sizeの使い方 テキストの文字サイズを変更したいときは、CSSでfont sizeで任意のサイズを指定することが出来ます。 以下は、「pタグのテキスト文に対して、フォントサイズを10pxに指定する」例です。 HTML <p>このテキストの大きさを変えたい</p> CSS p{ font-size:10px; } テキストの一部だけ文字サイズを変える 続いてテキストの一部だけサイズを変えたい場合は、変更したいテキストをHTMLのspanタグで囲みます。 以下は、「pタグ内のspanタグのテキスト文に対して、フォントサイズを10pxに指定する」例です。 HTML <p>テキストのなかで<span>ここだけ変えたい</span>です。</p> CSS p span{ font-size:10px; } 以上となります。
