CSS 3のcounter()の使い方の詳細

1554 ワード

counter()の定義と使い方:contentとともに主に使用される関数です.counter()を使用して、定義されたカウンタ識別子を呼び出します.構文:
counter(<identifier>,list-style-type)

パラメータ解析:(1).:counter-incrementで定義された属性値は、ドキュメントに挿入されたカウンタ識別子名を示すために使用されます.(2).list-style-type:カウンタを設定するスタイルで、list-style-typeに少し似ています.デフォルトでは10制に設定されていますが、upper-romanやupper-alphaなどのスタイルをリセットすることもできます.このパラメータのリストは次のとおりです.
disc
circle
square
decimal
decimal-leading-zero
lower-roman
upper-roman
lower-greek
lower-latin
upper-latin
armenian
georgian
lower-alpha
upper-alpha
none
inherit

ブラウザサポート:(1).IEブラウザはこの属性をサポートする.(2).Googleブラウザはこのプロパティをサポートします.(3).火狐ブラウザはこの属性をサポートする.(4).operaブラウザはこのプロパティをサポートします.(5).safriaブラウザはこのプロパティをサポートします.特に、IE 7またはIE 7以下のブラウザでのみサポートされていません.継承:継承なし.インスタンス:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>    </title>
<style type="text/css">
ul li{list-style-type:none;}
ul li{counter-increment:antzone;}
ul li:before{content:counter(antzone)".";color:red;}
</style>
</head>
<body>
<ul>
  <li>       </li>
  <li>       </li>
  <li>       </li>
  <li>       </li>
</ul>
</body>
</html>

原文の住所は次のとおりです.http://www.softwhy.com/forum.php?mod=viewthread&tid=1154
詳細css 3については、次の項目を参照してください.http://www.softwhy.com/css3/