|
| 1 | +<!DOCTYPE html> |
| 2 | +<html lang="en"> |
| 3 | + <head> |
| 4 | + <meta charset="utf-8"> |
| 5 | + <meta http-equiv="X-UA-Compatible" content="IE=Edge"> |
| 6 | + <title> |
| 7 | + tachyons-lists / General / Docs / TACHYONS |
| 8 | + </title> |
| 9 | + <meta name="author" content="@mrmrs"> |
| 10 | + <meta name="description" content="CSS"> |
| 11 | + <meta name="viewport" content="width=device-width, initial-scale=1"> |
| 12 | + <link rel="stylesheet" href="/css/tachyons.min.css"> |
| 13 | + </head> |
| 14 | + <body class="w-100 sans-serif"> |
| 15 | + <header class="w-100 pa3 ph5-ns bg-near-white"> |
| 16 | + <div class="dt w-100"> |
| 17 | + <div class="dtc v-mid tl w-50"> |
| 18 | + <a href="/" class="dib f5 f4-ns fw6 mt0 mb1 link black-50 dim" title="Home"> |
| 19 | + Tachyons |
| 20 | + <div class="dib"> |
| 21 | + <small class="nowrap f6 mt2 mt3-ns pr2 black-50 fw2">v4.0.0-beta.5</small> |
| 22 | + </div> |
| 23 | + </a> |
| 24 | + </div> |
| 25 | + <div class="db dtc v-mid w-100 tr"> |
| 26 | + |
| 27 | + <a title="Documentation" href="/docs/" |
| 28 | + class="f6 b dim link black-50 mr1 mr3-m mr4-l dib"> |
| 29 | + Docs |
| 30 | + </a> |
| 31 | + <a title="Tachyons on GitHub" href="http://github.com/mrmrs/tachyons/" |
| 32 | + class="f6 b dim link black-50 mr1 mr3-m mr4-l dib"> |
| 33 | + GitHub |
| 34 | + </a> |
| 35 | + <a title="Tachyons Npm Modules" href="/#npm" |
| 36 | + class="f6 b link black-50 dim dib"> |
| 37 | + Npm |
| 38 | + </a> |
| 39 | + </div> |
| 40 | + </div> |
| 41 | +</header> |
| 42 | + |
| 43 | + <main class=""> |
| 44 | + <article class="bg-near-white bt b--black-10 pa3 ph5-ns"> |
| 45 | + <h4 class="f4 mv0 fw6 dib mr4">tachyons-lists</h4> |
| 46 | + <span class="f4 b dib pl0 ml0 mr4">v2.0.3</span> |
| 47 | + <span class="f4 b dib pl0 ml0 mr4">46 B</span> |
| 48 | + <div> |
| 49 | + <dl class="dib mr4 mt0"> |
| 50 | + <dt class="f6 db">Declarations </dt> |
| 51 | + <dd class="db pl0 ml0 f4 f2-ns b">1</span></dd> |
| 52 | + </dl> |
| 53 | + <dl class="dib mr4"> |
| 54 | + <dt class="f6 db pr2">Selectors </dt> |
| 55 | + <dd class="db pl0 ml0 f4 f2-ns b">1</dd> |
| 56 | + </dl> |
| 57 | + <dl class="dib mr4"> |
| 58 | + <dt class="f6 db pr2">Max. Specificity Score </dt> |
| 59 | + <dd class="db pl0 ml0 f4 f2-ns b">10</dd> |
| 60 | + </dl> |
| 61 | + <dl class="dib mr4"> |
| 62 | + <dt class="f6 db pr2">Size of Avg. Rule </dt> |
| 63 | + <dd class="db pl0 ml0 f4 f2-ns b">1</dd> |
| 64 | + </dl> |
| 65 | + </div> |
| 66 | + <p class="measure f4 f3-ns lh-copy"> |
| 67 | + Tachyons has some basic list styling utilities for removing or tweaking default list styles. |
| 68 | + </p> |
| 69 | + </article> |
| 70 | +<div class="ph3 ph5-ns pt4 pb5"> |
| 71 | + <h2 class="f3 bold">Examples</h2> |
| 72 | + <ul> |
| 73 | + <li>Apples</li> |
| 74 | + <li>Oranges</li> |
| 75 | + <li>Banana</li> |
| 76 | + <li>Golf balls</li> |
| 77 | + </ul> |
| 78 | + <ul class="list-reset pl0"> |
| 79 | + <li>One</li> |
| 80 | + <li>Two</li> |
| 81 | + <li>Three</li> |
| 82 | + <li>Four</li> |
| 83 | + </ul> |
| 84 | + <div class="mt5 cf"> |
| 85 | + <div class="dib mr4"> |
| 86 | + <h1 class="f4 ttu tracked fw6">Previous</h1> |
| 87 | + <a href="/docs/layout/position/" class="link fw6 blue dim">Position</a> |
| 88 | + </div> |
| 89 | + <div class="dib"> |
| 90 | + <h1 class="f4 ttu tracked fw6">Next</h1> |
| 91 | + <a href="/docs/themes/background-size/" class="link fw6 blue dim">Background Size</a> |
| 92 | + </div> |
| 93 | + </div> |
| 94 | + <div class="mt5"> |
| 95 | + <h1 class="f4 ttu tracked fw6">Reference</h1> |
| 96 | + <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/%3Ahover" class="link db fw6 blue dim">MDN - Hover</a> |
| 97 | + <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/%3Afocus" class="link db fw6 blue dim">MDN - Focus</a> |
| 98 | + </div> |
| 99 | +</div> |
| 100 | + <section class="bg-near-white black-70 pt4 pb5"> |
| 101 | +<header class="ph3 ph5-ns pt4"> |
| 102 | + <kbd class="yellow">src/_lists.css</kbd> |
| 103 | +</header> |
| 104 | +<pre class="ph3 ph5-ns"> |
| 105 | +<code class="code" style="font-size: .75rem;"> |
| 106 | +/* |
| 107 | + |
| 108 | + LISTS |
| 109 | + |
| 110 | +*/ |
| 111 | + |
| 112 | +.list { list-style-type: none; } |
| 113 | + |
| 114 | +</code> |
| 115 | +</pre> |
| 116 | + </section> |
| 117 | + <div class="ph3 ph5-ns pt3 pb5"> |
| 118 | + <section> |
| 119 | + <h2 class="f6 fw7 ttu tracked">Elements</h2> |
| 120 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/general/images/" title="Images">Images</a> |
| 121 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/general/links/" title="Images">Links</a> |
| 122 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/general/lists/" title="Images">Lists</a> |
| 123 | + <a class="f5 fw4 dim link mid-gray db pv1 dn" href="/docs/general/forms/" title="Images">Forms</a> |
| 124 | + <section class="cf w-100 mt3"> |
| 125 | + <article class="fn fl-ns w-100 w-25-l"> |
| 126 | + <h2 class="f6 fw7 ttu tracked" id="typography">Typography</h2> |
| 127 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/typography/scale" title="Type">Type Scale</a> |
| 128 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/typography/measure/garamond/" title="Measure">Measure</a> |
| 129 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/typography/line-height" title="Line Height">Line Height / Leading</a> |
| 130 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/typography/tracking" title="Tracking">Tracking</a> |
| 131 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/typography/font-weight" title="Font Weights">Font Weights</a> |
| 132 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/typography/font-family" title="Font Families">Font Families</a> |
| 133 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/typography/font-style" title="Font Families">Font Style</a> |
| 134 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/typography/vertical-align" title="Font Families">Vertical Align</a> |
| 135 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/typography/text-align" title="Text Align">Text Align</a> |
| 136 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/typography/text-transform" title="Text Transform">Text Transform</a> |
| 137 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/typography/text-decoration" title="Text Decoration">Text Decoration</a> |
| 138 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/typography/white-space" title="White Space">White Space</a> |
| 139 | + </article> |
| 140 | + <article class="fn fl-ns w-100 w-25-l"> |
| 141 | + <h2 class="f6 fw7 ttu tracked" id="layout">Layout</h2> |
| 142 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/debug/" title="Debugging">Debugging</a> |
| 143 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/layout/box-sizing" title="Box Sizing">Box Sizing</a> |
| 144 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/layout/spacing" title="Spacing">Spacing</a> |
| 145 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/layout/floats" title="Floats">Floats</a> |
| 146 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/layout/clearfix" title="Clears">Clearfix</a> |
| 147 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/layout/display" title="Display">Display</a> |
| 148 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/layout/widths" title="Widths">Widths</a> |
| 149 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/layout/max-widths" title="Max Widths">Max Widths</a> |
| 150 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/layout/heights" title="Heights">Heights</a> |
| 151 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/layout/position" title="Position">Position</a> |
| 152 | + </article> |
| 153 | + <article class="fn fl-ns w-100 w-25-l"> |
| 154 | + <h2 class="f6 fw7 ttu tracked">Theming</h2> |
| 155 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/themes/skins/" title="Hovers">Skins</a> |
| 156 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/themes/hovers/" title="Hovers">Hovers</a> |
| 157 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/themes/background-size/" title="Background Size">Background Size</a> |
| 158 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/themes/borders/" title="Borders">Borders</a> |
| 159 | + <a class="f5 fw4 dim link mid-gray db pv1" href="/docs/themes/border-radius/" title="Border Radius">Border Radius</a> |
| 160 | + </article> |
| 161 | + </section> |
| 162 | + </section> |
| 163 | +</div> |
| 164 | + |
| 165 | + </main> |
| 166 | + <footer class="bg-near-white mid-gray ph3 ph5-ns pv5 pv6-ns bt b--light-gray"> |
| 167 | + <a href="https://twitter.com/intent/tweet?text=Tachyons: Functional CSS for Humans.&url=http://tachyons.io" target="_blank" class="dn mb3 twitter bg-white link dim br2 ph2 pb1 pt0 lh-solid" style="background-color: #55acee;"> |
| 168 | + <svg class="geomicon dib v-mid" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="16" height="16" fill="#fff"> |
| 169 | + <path d="M2 4 C6 8 10 12 15 11 A6 6 0 0 1 22 4 A6 6 0 0 1 26 6 A8 8 0 0 0 31 4 A8 8 0 0 1 28 8 A8 8 0 0 0 32 7 A8 8 0 0 1 28 11 A18 18 0 0 1 10 30 A18 18 0 0 1 0 27 A12 12 0 0 0 8 24 A8 8 0 0 1 3 20 A8 8 0 0 0 6 19.5 A8 8 0 0 1 0 12 A8 8 0 0 0 3 13 A8 8 0 0 1 2 4"/> |
| 170 | + </svg> |
| 171 | + <span class="dib v-mid white fw6" style="font-size: 12px;">Tweet</span> |
| 172 | + </a> |
| 173 | + <article> |
| 174 | + <iframe src="https://ghbtns.com/github-btn.html?user=tachyons-css&repo=tachyons&type=star&count=true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe> |
| 175 | + <iframe src="https://ghbtns.com/github-btn.html?user=tachyons-css&repo=tachyons&type=fork&count=true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe> |
| 176 | + </article> |
| 177 | + |
| 178 | + <p> |
| 179 | + <a class="black-70 link dim b dib mr3" href="http://tachyons-slack-invite.herokuapp.com" title="Join our Slack Channel"> |
| 180 | + Join our Slack Channel |
| 181 | + </a> |
| 182 | + <a class="black-70 link dim b dib mr3" href="https://github.com/tachyons-css/tachyons/issues" title="File a bug, request a feature, ask a question!"> |
| 183 | + Open an Issue |
| 184 | + </a> |
| 185 | + <a class="black-70 link dim b dib mr3" href="https://github.com/tachyons-css" title="Tachyons-css on GitHub"> |
| 186 | + GitHub |
| 187 | + </a> |
| 188 | + </p> |
| 189 | + <p class="measure copy lh-copy"> |
| 190 | + Have a question? Need help? Feel free to open an issue on GitHub or ask a |
| 191 | + question in our slack channel. We're here to try and help make designing in |
| 192 | + the browser fun. |
| 193 | + </p> |
| 194 | + <small class="f6 measure db lh-copy mt5"> |
| 195 | + A tachyon /ˈtæki.ɒn/ or tachyonic particle is a hypothetical particle |
| 196 | + that always moves faster than light. |
| 197 | + The word comes from the Greek: |
| 198 | + <br> <br> |
| 199 | + ταχύς or tachys, meaning "swift, quick, fast, rapid" |
| 200 | + </small> |
| 201 | +</footer> |
| 202 | + |
| 203 | + <script> |
| 204 | + (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ |
| 205 | + (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), |
| 206 | + m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) |
| 207 | + })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); |
| 208 | + |
| 209 | +ga('create', 'UA-55773803-1', 'auto'); |
| 210 | +ga('send', 'pageview'); |
| 211 | + |
| 212 | + </script> |
| 213 | + |
| 214 | + </body> |
| 215 | +</html> |
0 commit comments