ホームページ作成 - 下線を引きたい

ホームページ作成ＴＯＰ > 文章や文字 > 下線を引きたい

下線を引きたい

文章の一部に下線を引きたい場合の方法を説明します

さまざまな場面で、文中に下線を引く場合がよくあると思います。

強調したい場合、注意事項などなど。この様な下線を引く場合には、下記の方法で簡単に引く事が可能になります。

また、下線自体の”色”や”太さや形状”を変化させたい場合には、それぞれ
下線を引きたい（色を変えたい）
下線を引きたい（線種や色も変えたい）
を参考にしてわかりやすホームページを作成してみてください。

sample

文章の一部に下線を引く方法です。

ＨＴＭＬ　～

～を使用する場合は、文中の下線を引きたい部分を～で囲います。

書き方は


文章の一部に<u>下線を引く</u>方法です。

こうなります

ホームページ作成ＴＯＰ > 文章や文字 > 下線を引きたい > このページのＴＯＰ　▲

ＨＴＭＬ　<ins>～</ins>

<ins>～</ins>を使用する場合は、文中の下線を引きたい部分を<ins>～</ins>で囲います。

書き方は


文章の一部に<ins>下線を引く</ins>方法です。

<ins>は、挿入や追加した部分を表現する事が目的なものですので、本来下線を引く為のものではないです。結果的に下線になります。 <ins>～</ins>の～に文字を入れておけば斜体になります。

こうなります

ホームページ作成ＴＯＰ > 文章や文字 > 下線を引きたい > このページのＴＯＰ　▲

スタイルシート　text-decoration:underline

下線を引きたい部分に、text-decoration:underline;のスタイルを適応します。文章中の一部の場合は～に対して設定します。

このtext-decorationを使用して、ＴＯＰ > リンク > リンクの下線を消す方法事ができますので参考にして下さい。

要素に直接書く

書き方は


文章の一部に<span style="text-decoration:underline">下線を引く</span>方法です。

headに書く

書き方は


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">

<html>
  <head>

<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">

 <style type="text/css">
 <!--
  span {text-decoration:underline}
 -->
 </style>
 </head>
 <body>

<p>文章の一部に<span>下線を引く</span>方法です。</p>

 </body>
</html>

こうなります