html - CSSの「下線」属性の線の太さを編集します

Question

次のようにCSSのテキストに下線を付けることができるので：

h4 {
  text-decoration: underline;
}

次に、描画された「線」を編集するにはどうすればよいですか。線に表示される色は簡単に指定できますcolor: redが、線の高さ、つまり太さはどのように編集しますか？

Answer 1

これを実現する1つの方法は次のとおりです。

HTML：

<h4>This is a heading</h4>

<h4><u>This is another heading</u></h4>

CSS：

u {
  text-decoration: none;
  border-bottom: 10px solid black;
}​

次に例を示します。http：//jsfiddle.net/AQ9rL/

Answer 2

私は次のような簡単なことをします：

.thickness-underline {
  display: inline-block;
  text-decoration: none;
  border-bottom: 1px solid black;
  margin-bottom: -1px;
}

• line-heightまたはを使用padding-bottomして、それらの間の位置を設定できます
• display: inline場合によっては使えます

デモ: http://jsfiddle.net/5580pqe8/