这是通过CSS完成的。您必须使用“border bottom”属性，而不是“文本装饰：下划线；”因此，您可以更灵活地使用线路。

a {
    text-decoration: none; /* remove the default underline; */
    border-bottom: 1px solid blue; /* Set the border width and color. */
    padding-bottom: 3px; /* Set the distance between the word and the line */
}

a {color: blue; border-bottom: 2px solid blue;
    -webkit-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -o-transition:all 0.3s;
    transition:all 0.3s;
}

a:hover {color: blue; border-bottom: 2px solid red;}