今天學習的幾個字型css屬性

來源:互聯網
上載者:User

1、font-variant,設定或檢索對象中的文本是否為小型的大寫字母。

預設屬性值為normal,為正常的字型

屬性值為small-caps,為小型的大寫字母字型

下面為一個測試例子:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"            "http://www.w3.org/TR/html4/strict.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title> New Document </title></head><style type="text/css">.dv{font-variant:small-caps;}</style><body><div class='dv'>My Name is John!</div></body></html>

2、text-decoration屬性,用於設定文字的裝飾,

預設屬性值為none,表示沒有裝飾;

屬性值為underline的時候,文字下面有底線;

屬性值為overline的時候,文字上面面有上劃線;

屬性值為line-through的時候,文字中間有貫穿線;

下面是一個關於text-decoration的一個例子:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"            "http://www.w3.org/TR/html4/strict.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title> New Document </title></head><style type="text/css">.underlineDv{border:1px solid red;text-decoration:underline;}.overlineDv{border:1px solid red;text-decoration:overline;}.lineThroughDv{border:1px solid red;text-decoration:line-through;}</style><body><div class='underlineDv'>底線,底線,底線,底線,底線,底線</div><br /><div class="lineThroughDv">貫穿線,貫穿線,貫穿線,貫穿線,貫穿線,貫穿線,</div><br /><div class='overlineDv'>閃爍,閃爍,閃爍,閃爍,閃爍,閃爍,閃爍,閃爍,</div></body></html>
相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.