Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>CSS3 实现翻转列表 by 一丝</title>
</head>
<body>
  <p>如何用 CSS3 实现一个翻转的列表,要求在IE中看到是正序的,非ie用户是倒序的(包括内容)</p>
  
  <h2>使用 Flex 和 counter-increment: list -1</h2>
  <p>前提是列表个数是已知且不变的</p>
<ol class="type-toc">
  <li>list 1</li>
  <li>list 2</li>
  <li>list 3</li>
  <li>list 4</li>
</ol>
  <h2>使用 Flex 和 ol 中的 reversed 属性</h2>
  <p>显然该方法更加灵活</p>
<ol reversed>
  <li>list 1</li>
  <li>list 2</li>
  <li>list 3</li>
  <li>list 4</li>
</ol>
  
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers