html - Edit line thickness of CSS 'underline' attribute

Question

Since you can underline any text in CSS like so:

h4 {
  text-decoration: underline;
}

How can you also then edit the 'line' that is drawn, the color you get on the line is easily specified as color: red but how does one edit the height of the line, i.e. the thickness?

Answer 1

Here is one way of achieving this :

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;
}?

Here is an example: http://jsfiddle.net/AQ9rL/