Опубликовано Оставить комментарий

CSS counters

Автоматическое добавление нумерации к заголовкам h1, h2 ….
функция CSS counter()

Beginnings at Netscape

In 1993, the National Center for Supercomputing Applications (NCSA), a unit of the University of Illinois at Urbana-Champaign, released NCSA Mosaic, the first popular graphical Web browser, which played an important part in expanding the growth of the nascent World Wide Web.

Server-side JavaScript

Netscape introduced an implementation of the language for server-side scripting with Netscape Enterprise Server in December 1995, soon after releasing JavaScript for browsers.

Adoption by Microsoft

Microsoft script technologies including VBScript and JScript were released in 1996. JScript, a reverse-engineered implementation of Netscape’s JavaScript, was part of Internet Explorer 3.

Standardization

In November 1996, Netscape submitted JavaScript to Ecma International to carve out a standard specification, which other browser vendors could then implement based on the work done at Netscape. This led to the official release of the language specification ECMAScript published in the first edition of the ECMA-262 standard in June 1997

Later developments

JavaScript has become one of the most popular programming languages on the Web. Initially, however, many professional programmers denigrated the language because, among other reasons, its target audience consisted of Web authors and other such “amateurs”.

CSS
.wrap {
   counter-reset: heading; /* init the counter for headings */
              /* // note you can give any other name */
  padding: 0px 24px 12px 24px;
}
.wrap h1 {
  counter-increment: heading; /* increments the counter on every H1 tag */
  counter-reset: subheading;  /* here we init or reset the subheading */
                /* so that we get 1.1, 1.2, 1.3, then after new heading it will go 2.1, 2.2, 2.3 */
}
.wrap h1:before {
  content: counter(heading) " - "; /* using :before selector and counter() function we can add the index to the heading */
}
.wrap h2 {
  counter-increment: subheading; /* increment the subheading counter on every H2 tag */
}
.wrap h2:before {
  content: counter(heading) "." counter(subheading) " - ";
}
Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *