CSS text-decoration

css3 text

css:

a {

    color:#0000ff;

    /*text-decoration: underline;*/

    text-decoration-color:red;

    -moz-text-decoration-color:red;

    text-decoration-style:solid;

    -moz-text-decoration-style:solid;

    text-decoration-line: underline;

    -moz-text-decoration-line: underline;

}



a.double {

    text-decoration-style:double;

    -moz-text-decoration-style:double;

}

a.dotted {

    text-decoration-style:dotted;

    -moz-text-decoration-style:dotted;

}

a.dashed {

    text-decoration-style:dashed;

    -moz-text-decoration-style:dashed;

}

a.wavy {

    text-decoration-style:wavy;

    -moz-text-decoration-style:wavy;

}



a.overline {

    text-decoration-line: overline;

    -moz-text-decoration-line: overline;

}



a.line-through {

    text-decoration-line: line-through;

    -moz-text-decoration-line: line-through;

}



a.underline-overline-line-through {

    text-decoration-line: underline overline line-through;

    -moz-text-decoration-line: underline overline line-through;

}

html:

<a href="#">link link link link link link</a>

<br>

<a href="#" class="double">double link double link double link</a>

<br>

<a href="#" class="dotted">dotted link dotted link dotted link</a>

<br>

<a href="#" class="dashed">dashed link dashed link dashed link</a>

<br>

<a href="#" class="wavy">wavy link wavy link wavy link</a>



<br><br>

<a href="#" class="overline">overline link overline link</a>



<br><br>

<a href="#" class="line-through">line-through link line-through link</a>



<br><br>

<a href="#" class="underline-overline-line-through">underline overline line-through link</a>