diff options
Diffstat (limited to 'files/ca/web/css/_colon_only-child/index.html')
| -rw-r--r-- | files/ca/web/css/_colon_only-child/index.html | 198 |
1 files changed, 0 insertions, 198 deletions
diff --git a/files/ca/web/css/_colon_only-child/index.html b/files/ca/web/css/_colon_only-child/index.html deleted file mode 100644 index 43d5ef0a2a..0000000000 --- a/files/ca/web/css/_colon_only-child/index.html +++ /dev/null @@ -1,198 +0,0 @@ ---- -title: ':only-child' -slug: 'Web/CSS/:only-child' -tags: - - CSS - - Layout - - Pseudo-class - - Reference - - Web -translation_of: 'Web/CSS/:only-child' ---- -<div>{{CSSRef}}</div> - -<p>La <a href="/en-US/docs/CSS/Pseudo-classes" title="Pseudo classes">pseudo-class </a><a href="https://developer.mozilla.org/en-US/docs/Web/CSS">CSS</a> <strong><code>:only-child</code></strong> representa un element sense germans. És el mateix que <code>:first-child:last-child</code> o <code>:nth-child(1):nth-last-child(1)</code>, però amb una menor especificitat.</p> - -<pre class="brush: css no-line-numbers">/* <span id="result_box" lang="ca"><span>Selecciona cada <p>, però només si és l'únic fill del seu pare</span></span> */ -p:only-child { - background-color: lime; -}</pre> - -<div class="note"> -<p><strong>Nota</strong>: Com es va definir originalment, l'element seleccionat havia de tenir un pare. A partir dels Selectores Nivell 4, això ja no és necessari.</p> -</div> - -<h2 id="Sintaxi">Sintaxi</h2> - -{{csssyntax}} - -<h2 id="Exemples">Exemples</h2> - -<h3 id="Exemple_bàsic">Exemple bàsic</h3> - -<h4 id="HTML">HTML</h4> - -<pre class="brush: html"><main> - <div> - <i>I am a lonely only child.</i> - </div> - - <div> - <i>I have siblings.</i><br> - <b>So do I!</b><br> - <span>I also have siblings, <span>but this is an only child.</span></span> - </div> -</main></pre> - -<h4 id="CSS">CSS</h4> - -<pre class="brush: css">main :only-child { - color: red; -} -</pre> - -<h4 id="Resultat">Resultat</h4> - -<p>{{EmbedLiveSample('Basic_example','100%',180)}}</p> - -<h3 id="Un_exemple_de_llista"><span class="short_text" id="result_box" lang="ca"><span>Un exemple de llista</span></span></h3> - -<h4 id="HTML_2">HTML</h4> - -<pre class="brush: html"><ol> - <li>First - <ul> - <li>This list has just one element. - </ul> - </li> - <li>Second - <ul> - <li>This list has three elements. - <li>This list has three elements. - <li>This list has three elements. - </ul> - </li> -<ol> -</pre> - -<h4 id="CSS_2">CSS</h4> - -<pre class="brush: css">li li { - list-style-type: disc; -} -li:only-child { - color: red; - list-style-type: square; -}</pre> - -<h4 id="Resultat_2">Resultat</h4> - -<p>{{EmbedLiveSample('A_list_example', '100%', 210)}}</p> - -<h2 id="Especificacions">Especificacions</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Especificació</th> - <th scope="col">Estat</th> - <th scope="col">Comentari</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('CSS4 Selectors', '#only-child-pseudo', ':only-child')}}</td> - <td>{{Spec2('CSS4 Selectors')}}</td> - <td><span id="result_box" lang="ca"><span>No es requereix que els elements coincidents tinguin un pare.</span></span></td> - </tr> - <tr> - <td>{{SpecName('CSS3 Selectors', '#only-child-pseudo', ':only-child')}}</td> - <td>{{Spec2('CSS3 Selectors')}}</td> - <td>Definició inicial.</td> - </tr> - </tbody> -</table> - -<h2 id="Navegadors_compatibles">Navegadors compatibles</h2> - -<div>{{CompatibilityTable}}</div> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Descripció</th> - <th>Chrome</th> - <th>Edge</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Suport bàsic</td> - <td>2</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatGeckoDesktop(1.8)}}</td> - <td>9</td> - <td>{{CompatOpera(9.5)}}</td> - <td>3.1</td> - </tr> - <tr> - <td>No es requereix cap pare</td> - <td>{{CompatChrome(57)}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatOpera(44)}}</td> - <td>{{CompatUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Descripció</th> - <th>Android Webview</th> - <th>Chrome for Android</th> - <th>Edge</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Suport bàsic</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatGeckoMobile(1.8)}}</td> - <td>9</td> - <td>{{CompatOperaMobile(10)}}</td> - <td>3.1</td> - </tr> - <tr> - <td>No es requereix cap pare</td> - <td>{{CompatChrome(57)}}</td> - <td>{{CompatChrome(57)}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatOperaMobile(44)}}</td> - <td>{{CompatUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<h2 id="Vegeu_també">Vegeu també</h2> - -<ul> - <li>{{Cssxref(":only-of-type")}}</li> - <li>{{Cssxref(":first-child")}}</li> - <li>{{Cssxref(":last-child")}}</li> - <li>{{Cssxref(":nth-child")}}</li> -</ul> |