使用CSS UL / OL格式化法律文件

时间:2011-11-10 13:30:02

标签: html css

HTML / CSS中是否有任何方法可以格式化需要与原始文档格式保持一致的法律文档。换句话说。

  1. 主标题

    1.1副标题

    1.2副标题

    1.3副标题

    1.3.1 Sub Sub Heading
    
    1.3.2 Sub Sub Heading
    

    1.4 Sub Heading

  2. 主标题

    2.1子标题

  3. 等等...等等......

    我知道您可以使用嵌套的OL,但这不会呈现我需要的内容

    修改

    当然,在IE出现丑陋的头脑之前,这真是太好了! (我不得不怀疑微软的开发人员必须考虑数百万关于他们产品的抱怨。)我找到了这个解决方案http://www.sitepoint.com/techy-treasures-5-fudging-css-counters-in-internet-explorer/,并尝试实施它。

    部分工作,但我不知道如何正确使用这个表达式:

      #css-counters-test li  
      {  
         zoom: expression(  
          (typeof step == "undefined" ? step = 1 : step++),  
          this.innerHTML = (typeof this.processed == "undefined"  
                ? ("<span class=before>" + step + ": </span>")  
                : "")  
            + this.innerHTML,  
          this.processed = true,  
          this.runtimeStyle.zoom = "1"  
          );  
      }
    

2 个答案:

答案 0 :(得分:8)

对于此类功能,您可以使用counter-increment属性检查:

<强> HTML

<ol>
  <li>item 1
    <ol>
      <li>sub item 1
        <ol>
          <li>sub-sub item 1</li>
          <li>sub-sub item 2</li>
          <li>sub-sub item 3</li>
        </ol>
      </li>
      <li>Sub item 2</li>
   </ol>
  </li>
  <li>item 2</li>
</ol>

<强> CSS

ol {
  counter-reset: section;
  list-style-type: none;
}
ol ol ol{background:#c0c0c0; padding-left:10px;}       
ol li { counter-increment: section; }

ol li:before  { content: counters(section, ".") ". "; }

可以找到使用此属性的实例:here

Opera dev site

的相关阅读

答案 1 :(得分:0)

你有正确的想法,只需要使用{content:;}{counter:;}

Live example can be found here