色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

可以為有序列表指定一個(gè)起始編號(hào)嗎？

CSS

我有一個(gè)有序列表，我希望初始數(shù)是6。我發(fā)現(xiàn)在HTML 4.01中使用start屬性支持這一點(diǎn)(現(xiàn)在已被否決)。在這個(gè)規(guī)范中，他們說(shuō)你可以通過(guò)使用CSS來(lái)指定起始整數(shù)。

你如何用CSS指定起始數(shù)字？

如果您需要在特定點(diǎn)啟動(dòng)有序列表(OL)的功能，您必須將doctype指定為HTML 5；那就是:

<!doctype html>

對(duì)于該doctype，在有序列表上設(shè)置start屬性是有效的。比如:

<ol start="6">
  <li>Lorem</li>
  <li>Ipsum</li>
  <li>Dolor</li>
</ol>

& ltol start= " " >在HTML5中不再被棄用，所以我會(huì)繼續(xù)使用它，不管HTML4.01怎么說(shuō)。

start = & quot數(shù)字& quot不幸的是，它不會(huì)根據(jù)前面的編號(hào)自動(dòng)改變。

另一種可能適合更復(fù)雜需求的方法是使用計(jì)數(shù)器復(fù)位和計(jì)數(shù)器遞增。

問(wèn)題

假設(shè)你想要這樣的東西:

1. Item one
2. Item two

Interruption from a <p> tag

3. Item three
4. Item four

您可以設(shè)置start = & quot3 & quot在第二個(gè)ol的第三個(gè)li上，但是現(xiàn)在每當(dāng)你向第一個(gè)ol添加一個(gè)項(xiàng)目時(shí)，你都需要改變它

解決辦法

首先，讓我們清除當(dāng)前編號(hào)的格式。

ol {
  list-style: none;
}

我們會(huì)讓每個(gè)李展示柜臺(tái)

ol li:before {
  counter-increment: mycounter;
  content: counter(mycounter) ". ";
}

現(xiàn)在我們只需要確保計(jì)數(shù)器只在第一個(gè)ol上復(fù)位，而不是每次都復(fù)位。

ol:first-of-type {
  counter-reset: mycounter;
}

演示

http://codepen.io/ajkochanowicz/pen/mJeNwY

ol
  list-style: none
  
li
  &:before
    counter-increment: mycounter
    content: counter(mycounter) ". "
    
  &:first-of-type
    counter-reset: mycounter

<ol>
  <li>Item one</li>
  <li>Item two</li>
</ol>
<p>Interruption</p>
<ol>
  <li>Item three</li>
  <li>Item four</li>
</ol>
<p>Interruption</p>
<ol>
  <li>Item five</li>
  <li>Item six</li>
</ol>

我很驚訝我沒(méi)能在這個(gè)帖子里找到答案。

我找到了這個(gè)來(lái)源，我總結(jié)如下:

若要使用CSS而不是HTML來(lái)設(shè)置有序列表的start屬性，可以使用counter-increment屬性，如下所示:

ol {
  list-style: none;
  counter-increment: start 3;
  }
li:before {
  content: counter(start, lower-alpha) ") ";
  counter-increment: start;
  }

counter-increment似乎是0索引的，所以要獲得從4開(kāi)始的列表，請(qǐng)使用3。

對(duì)于以下HTML

<ol>
  <li>Buy milk</li>
  <li>Feed the dog</li>
  <li>Drink coffee</li>
</ol>

我的結(jié)果是

d) Buy milk
e) Feed the dog
f) Drink coffee

看看我的小提琴

另請(qǐng)參見(jiàn)W3 wiki參考

正如其他人建議的，可以使用ol元素的start屬性。

或者，可以使用li元素的value屬性。在HTML 4.01中，這兩個(gè)屬性都被標(biāo)記為不推薦使用，但在HTML 5 (ol和li)中卻沒(méi)有。

<ol start="-2">
  <li>Alpha</li>
  <li>Beta</li>
  <li value="10">Gamma</li>
  <li>Delta</li>
</ol>

通過(guò)HTML，使用start屬性

列表項(xiàng)開(kāi)始計(jì)數(shù)的整數(shù)。總是一個(gè)阿拉伯?dāng)?shù)字(1，2，3等。)，即使編號(hào)類型是字母或羅馬數(shù)字。例如，從字母& quotd & quot或者羅馬數(shù)字& quot四、& quot使用start = & quot4 & quot。

<ol start="10">
  <li>Ten</li>
  <li>Eleven</li>
  <li>Twelve</li>
</ol>

從不同于默認(rèn)值(“1”)的數(shù)字開(kāi)始對(duì)有序列表進(jìn)行編號(hào)需要start屬性。該屬性在HTML 4.01規(guī)范中是允許的(不被取代)(在發(fā)布該問(wèn)題時(shí)，HTML 4.01還不是“被取代的規(guī)范”)，并且在當(dāng)前的HTML 5.2規(guī)范中仍然是允許的。在XHTML 1.0的過(guò)渡DTD中，ol元素還有一個(gè)可選的start屬性，但在XHTML 1.0的嚴(yán)格DTD中沒(méi)有t(搜索字符串ATTLIST ol并檢查屬性列表)。因此，盡管一些老的評(píng)論說(shuō)，開(kāi)始屬性沒(méi)有被否決；相反，它在HTML 4.01和XHTML 1.0的嚴(yán)格dtd中是無(wú)效的。不管其中一個(gè)評(píng)論怎么說(shuō)，start屬性在ul元素中是不允許的，而且目前在Firefox和Chromium中也不起作用。

還要注意千位分隔符不起作用(在Firefox和Chromium的當(dāng)前版本中)。在下面的代碼片段中，10.000將被解釋為10；同樣適用于10000。所以不要使用以下類型的計(jì)數(shù)器值:

<ol start="10.000">
  <li>Item 10.000</li>
  <li>Next item</li>
  <li>Next item</li>
</ol>

因此，您應(yīng)該使用以下代碼(在極少數(shù)情況下，需要大于1000的值):

<ol start="10000">
  <li>Item 10.000</li>
  <li>Next item</li>
  <li>Next item</li>
</ol>

其他一些答案建議使用CSS屬性計(jì)數(shù)器，但這與傳統(tǒng)的內(nèi)容和布局分離(分別在HTML和CSS中)背道而馳。有一定視覺(jué)障礙的用戶可能會(huì)使用他們自己的樣式表，結(jié)果計(jì)數(shù)器值可能會(huì)丟失。還應(yīng)該測(cè)試屏幕閱讀器對(duì)計(jì)數(shù)器的支持。屏幕閱讀器對(duì)CSS中內(nèi)容的支持是一個(gè)相對(duì)較新的特性，其行為不一定一致。請(qǐng)參見(jiàn)屏幕閱讀器和CSS:我們正在過(guò)時(shí)(進(jìn)入內(nèi)容)嗎？作者John Northup在WebAIM博客上(2017年8月)。

如果列表是嵌套的，那么必須有一個(gè)處理方法來(lái)省略嵌套的列表項(xiàng)，我通過(guò)驗(yàn)證grand parent不是列表項(xiàng)來(lái)完成這個(gè)處理。

var section = document.getElementById("TheContent");
var list = section.getElementsByTagName("li");
var cnt = 0;
for (var i=0;i<list.length;i++){
  if (list[i].parentElement.parentElement.nodeName!="LI") {
    cnt += 1;
    list[i].setAttribute("value",cnt);
  }
}

<!DOCTYPE html>
<html>
<body>

<section id="TheContent">
<h2>Ordered Lists - numbering not interupted</h2>
<p>This example avoids for the first list level that each ordered list starts with 1:</p>

<p><strong>1st list:</strong></p>
<ol>
  <li>list item 1</li>
  <li>list item 2</li>
  <li>list item 3</li>
</ol>

<p><strong>2nd list:</strong></p>
<ol>
  <li>item</li>
  <li>item
    <ol>
      <li>item</li>
      <li>item</li>
      <li>item</li>
    </ol>
  </li>
  <li>item</li>
</ol>
</section>

</body>
</html>

對(duì)于CSS來(lái)說(shuō)，覆蓋嵌套列表項(xiàng)的情況有點(diǎn)棘手，因此只有第一個(gè)列表級(jí)別獲得自定義編號(hào)，而不會(huì)打斷每個(gè)新的有序列表。我使用CSS combinator ' >'來(lái)定義列表項(xiàng)的可能路徑，這些列表項(xiàng)將獲得自定義編號(hào)。參見(jiàn)https://www.w3schools.com/css/css_combinators.asp

body {
  counter-reset: li_cnt;
}
/* discard auto generated numbers */
ol {
  list-style-type: none;
}
/* all possible paths to the list item that shall have custom numbering */
section#TheContent > ol > li:before,
body > ol > li:before {
  counter-increment: li_cnt;
  content: counter(li_cnt)'. '; /* add own numbers */
}
/* switch on default auto generated numbers for nested list items */
li > ol {
  list-style-type: decimal;
}

<!DOCTYPE html>
<html>
<body>

<section id="TheContent">
<h2>Ordered Lists - numbering not interupted</h2>
<p>This example avoids for the first list level that each ordered list starts with 1:</p>

<p><strong>1st list:</strong></p>
<ol>
  <li>list item 1</li>
  <li>list item 2</li>
  <li>list item 3</li>
</ol>

<p><strong>2nd list:</strong></p>
<ol>
  <li>item</li>
  <li>item
    <ol>
      <li>item</li>
      <li>item</li>
      <li>item</li>
    </ol>
  </li>
  <li>item</li>
</ol>
</section>

</body>
</html>

顯然既不是@有序列表的開(kāi)始& ltol & gt列表項(xiàng)的nor @ value & lt；李& gt可以通過(guò)CSS設(shè)置。參見(jiàn)https://www.w3schools.com/css/css_list.asp

在CSS中用計(jì)數(shù)器代替編號(hào)似乎是最好的/最快的/萬(wàn)無(wú)一失的解決方案，也有其他人在推廣它，例如https://css-tricks.com/numbering-in-style/

使用純JavaScript可以設(shè)置每個(gè)列表項(xiàng)的@value，但這當(dāng)然比CSS慢。甚至不需要檢查列表項(xiàng)是否屬于有序列表& ltol & gt，因?yàn)闊o(wú)序列表會(huì)被自動(dòng)忽略。

var section = document.getElementById("TheContent");
var list = section.getElementsByTagName("li");
for (var i=0; i<list.length; i++){
  if (list[i].parentElement.nodeName=="OL") {
    list[i].setAttribute("value",i+1);
  }
}

<!DOCTYPE html>
<html>
<body>

<section id="TheContent">
  <h2>Ordered Lists - numbering not interupted</h2>
  <p>This example avoid that each ordered list starts with 1:</p>

  <p><strong>1st list:</strong></p>
  <ol>
    <li>list item 1</li>
    <li>list item 2</li>
    <li>list item 3</li>
  </ol>

  <p><strong>2nd list:</strong></p>
  <ol>
    <li>list item 4</li>
    <li>list item 5</li>
    <li>list item 6</li>
  </ol>
  </section>

</body>
</html>