html – 使用CSS UL / OL进行法律文档格式化

发布时间：2020-12-14 22:29:51 所属栏目：资源来源：网络整理

导读：HTML / CSS中是否有任何方法可以格式化需要与原始文档格式保持一致的法律文档.换一种说法. 主要标题 1.1副标题 1.2副标题 1.3副标题 1.3.1 Sub Sub Heading1.3.2 Sub Sub Heading 1.4副标题主要标题 2.1副标题等……等等…… 我知道你可以使用嵌套的OL,但

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

>主要标题

1.1副标题

1.2副标题

1.3副标题

1.3.1 Sub Sub Heading

1.3.2 Sub Sub Heading

1.4副标题
>主要标题

2.1副标题

等……等等……

我知道你可以使用嵌套的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"  
      );  
  }

解决方法

对于此类功能,您可以使用 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找到