›スタイルシートデザインの方法リンクで表示される下線のスタイルを設定するホームページでリンクを表示した場合、デフォルトで下線が表示されます。この下線についてスタイルシートを設定することで色を変更したり線の種類を変更することができます。ここではスタイルシートを使ってリンクの下線のスタイルを変更する方法について解説します。日更新)目次リンクの下線を非表示にするリンクにマウスを合わせたときに下線を表示するリンク毎に異なる色や線の種類で下線を表示するリンクの下線を非表示にする最初にリンクの下線を非表示にしてみます。プロパティについては「文字の装飾(text-decoration)」を参照されて下さい)。text-decoration:none;}例えば次のようなリンクを対象に設定してみます。href="http://www.example.com/">メニュー3</a></p></body></html>リンクの下線を非表示にするためにスタイルシートを追加で記述します。href="http://www.example.com/">メニュー3</a></p></body></html>作成したページをブラウザで開くと次のように表示されます。リンクの下線が非表示になりました。リンクにマウスを合わせたときに下線を表示するリンクの下線を非表示にした状態で、リンクにマウスを合わせたときだけリンクの下線を表示するように設定してみます。text-decoration:underline;}それでは実際に試してみます。href="http://www.example.com/">メニュー3</a></p></body></html>作成したページをブラウザで開くと次のように表示されます。いずれかのリンクにマウスを合わせると、マウスを合わせたリンクだけに下線が表示されます。リンク毎に異なる色や線の種類で下線を表示する複数のリンクがある場合に、リンク毎に表示される下線の色や線の種類を変更してみます。対して異なるスタイルを設定します。プロパティに対して設定できます。目のリンクは色を赤に設定しました。目のリンクは色を黒にして線の種類を破線に設定しました。black;}それでは実際に試してみます。href="http://www.example.com/">メニュー3</a></p></body></html>作成したページをブラウザで開くと次のように表示されます。リンク毎に異なるスタイルが設定されていることが確認できました。--スタイルシートを使ってリンクの下線のスタイルを変更する方法について解説しました。IKURA初心者~中級者の方を対象としたプログラミング方法や開発環境の構築の解説を行うサイトの運営を行っています。