andre/30-seconds-of-code
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Travis build: 66 [cron]

Browse Source
This commit is contained in:
30secondsofcode
2018-11-21 20:52:46 +00:00
parent ea575d489d
commit d8a622a294
2 changed files with 2 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/index.html
View File

@ -109,7 +109,7 @@ li::before {
counter-increment: counter;
content: counters(counter, '.') ' ';
}
</code></pre> <h4>Demo</h4> <div class="snippet-demo" data-scope="counter.md"> <ul> <li>List item</li> <li>List item</li> <li> List item <ul> <li>List item</li> <li>List item</li> <li>List item</li> </ul> </li> </ul> </div> <h4>Explanation</h4> <p>You can create a ordered list using any type of HTML.</p> <ol> <li> <p><code>counter-reset</code> Initializes a counter, the value is the name of the counter. By default, the counter starts in 0. This property can also be used to change its value to any specific number.</p> </li> <li> <p><code>counter-increment</code> Used in element that will be countable. Once <code>counter-reset</code> initialized, a counter's value can be increased or decreased.</p> </li> <li> <p><code>counter(name, style)</code> Displays the value of a section counter. Generally used in a <code>content</code> property. This function can receive two parameters, the first as the name of the counter and the second one can be <code>decimal</code> or <code>upper-roman</code> (<code>decimal</code> by default).</p> </li> <li> <p><code>counters(counter, string, style)</code> Displays the value of a section counter. Generally used in a <code>content</code> property. This function can receive three parameters, the first as the name of the counter, the second one you can include a string which comes after the counter and the third one can be <code>decimal</code> or <code>upper-roman</code> (<code>decimal</code> by default).</p> </li> <li> <p>A CSS counter can be especially useful for making outlined lists, because a new instance of the counter is automatically created in child elements. Using the <code>counters()</code> function, separating text can be inserted between different levels of nested counters.</p> </li> </ol> <h4>Browser support</h4> <div> <div class="snippet__browser-support"> 98.4% </div> </div> <p><span class="snippet__support-note">✅ No caveats.</span></p> <ul> <li> <a href="https://caniuse.com/#feat=css-counters" target="_blank">https://caniuse.com/#feat=css-counters</a> </li> </ul> </div> <div class="snippet"> <h3 id="custom-scrollbar"><span>Custom scrollbar</span><span class="tags__tag snippet__tag" data-type="visual"><i data-feather="eye"></i>visual</span></h3> <p>Customizes the scrollbar style for the document and elements with scrollable overflow, on WebKit platforms.</p> <h4 data-type="HTML">HTML</h4><pre><code class="lang-html">&lt;div class="custom-scrollbar"&gt;
</code></pre> <h4>Demo</h4> <div class="snippet-demo" data-scope="counter.md"> <ul> <li>List item</li> <li>List item</li> <li> List item <ul> <li>List item</li> <li>List item</li> <li>List item</li> </ul> </li> </ul> </div> <h4>Explanation</h4> <p>You can create a ordered list using any type of HTML.</p> <ol> <li> <p><code>counter-reset</code> Initializes a counter, the value is the name of the counter. By default, the counter starts at 0. This property can also be used to change its value to any specific number.</p> </li> <li> <p><code>counter-increment</code> Used in element that will be countable. Once <code>counter-reset</code> initialized, a counter's value can be increased or decreased.</p> </li> <li> <p><code>counter(name, style)</code> Displays the value of a section counter. Generally used in a <code>content</code> property. This function can receive two parameters, the first as the name of the counter and the second one can be <code>decimal</code> or <code>upper-roman</code> (<code>decimal</code> by default).</p> </li> <li> <p><code>counters(counter, string, style)</code> Displays the value of a section counter. Generally used in a <code>content</code> property. This function can receive three parameters, the first as the name of the counter, the second one you can include a string which comes after the counter and the third one can be <code>decimal</code> or <code>upper-roman</code> (<code>decimal</code> by default).</p> </li> <li> <p>A CSS counter can be especially useful for making outlined lists, because a new instance of the counter is automatically created in child elements. Using the <code>counters()</code> function, separating text can be inserted between different levels of nested counters.</p> </li> </ol> <h4>Browser support</h4> <div> <div class="snippet__browser-support"> 98.4% </div> </div> <p><span class="snippet__support-note">✅ No caveats.</span></p> <ul> <li> <a href="https://caniuse.com/#feat=css-counters" target="_blank">https://caniuse.com/#feat=css-counters</a> </li> </ul> </div> <div class="snippet"> <h3 id="custom-scrollbar"><span>Custom scrollbar</span><span class="tags__tag snippet__tag" data-type="visual"><i data-feather="eye"></i>visual</span></h3> <p>Customizes the scrollbar style for the document and elements with scrollable overflow, on WebKit platforms.</p> <h4 data-type="HTML">HTML</h4><pre><code class="lang-html">&lt;div class="custom-scrollbar"&gt;
&lt;p&gt;
Lorem ipsum dolor sit amet consectetur adipisicing elit.&lt;br&gt;
Iure id exercitationem nulla qui repellat laborum vitae, &lt;br&gt;

2
index.html
View File

@ -559,7 +559,7 @@ li::before {
<p>You can create a ordered list using any type of HTML.</p>
<ol>
<li>
<p><code>counter-reset</code> Initializes a counter, the value is the name of the counter. By default, the counter starts in 0. This property can also be used to change its value to any specific number.</p>
<p><code>counter-reset</code> Initializes a counter, the value is the name of the counter. By default, the counter starts at 0. This property can also be used to change its value to any specific number.</p>
</li>
<li>
<p><code>counter-increment</code> Used in element that will be countable. Once <code>counter-reset</code> initialized, a counter's value can be increased or decreased.</p>