aboutsummaryrefslogtreecommitdiff
path: root/files/ca/web/css/child_combinator
diff options
context:
space:
mode:
authorFlorian Merz <me@fiji-flo.de>2021-02-11 14:45:12 +0100
committerFlorian Merz <me@fiji-flo.de>2021-02-11 14:45:12 +0100
commitcb9e359a51c3249d8f5157db69d43fd413ddeda6 (patch)
treeae3040d626c3b5717da5bda2af9f0a9ff9bd389f /files/ca/web/css/child_combinator
parent8260a606c143e6b55a467edf017a56bdcd6cba7e (diff)
downloadtranslated-content-cb9e359a51c3249d8f5157db69d43fd413ddeda6.tar.gz
translated-content-cb9e359a51c3249d8f5157db69d43fd413ddeda6.tar.bz2
translated-content-cb9e359a51c3249d8f5157db69d43fd413ddeda6.zip
unslug ca: move
Diffstat (limited to 'files/ca/web/css/child_combinator')
-rw-r--r--files/ca/web/css/child_combinator/index.html135
1 files changed, 135 insertions, 0 deletions
diff --git a/files/ca/web/css/child_combinator/index.html b/files/ca/web/css/child_combinator/index.html
new file mode 100644
index 0000000000..f5cb8139f9
--- /dev/null
+++ b/files/ca/web/css/child_combinator/index.html
@@ -0,0 +1,135 @@
+---
+title: Combinador de fills
+slug: Web/CSS/Selectors_de_fills
+tags:
+ - CSS
+ - NeedsMobileBrowserCompatibility
+ - Reference
+ - Selectors
+translation_of: Web/CSS/Child_combinator
+---
+<div>{{CSSRef("Selectors")}}</div>
+
+<p>El<strong> combinador de fills</strong> (<code>&gt;</code>) es col·loca entre dos selectors CSS. Solament coincideix amb aquells elements que coincideixen amb el segon selector que són fills d'elements que coincideixen amb el primer.</p>
+
+<pre class="brush: css no-line-numbers">/* Enumera els elements que són fills de la llista "my-things" */
+ul.my-things &gt; li {
+ margin: 2em;
+}</pre>
+
+<p>Els elements que coincideixin amb el segon selector han de ser els fills immediats dels elements que coincideixin amb el primer selector. Això és més estricte que el <a href="/en-US/docs/Web/CSS/Descendant_selectors">selector descendent</a>, que coincideix amb tots els elements que coincideixen amb el segon selector per al qual existeix un element ancestral coincident amb el primer selector, independentment de la quantitat de "salts" en el DOM</p>
+
+<h2 id="Sintaxi">Sintaxi</h2>
+
+<pre class="syntaxbox">selector1 &gt; selector2 { <em>style properties</em> }
+</pre>
+
+<h2 id="Exemple">Exemple</h2>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css">span {
+ background-color: white;
+}
+
+div &gt; span {
+ background-color: DodgerBlue;
+}
+</pre>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;div&gt;
+ &lt;span&gt;Span #1, in the div.
+ &lt;span&gt;Span #2, in the span that's in the div.&lt;/span&gt;
+ &lt;/span&gt;
+&lt;/div&gt;
+&lt;span&gt;Span #3, not in the div at all.&lt;/span&gt;
+</pre>
+
+<h3 id="Resultat">Resultat</h3>
+
+<p>{{EmbedLiveSample("Example", 200, 100)}}</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', '#child-combinators', 'child combinator')}}</td>
+ <td>{{Spec2('CSS4 Selectors')}}</td>
+ <td> </td>
+ </tr>
+ <tr>
+ <td>{{SpecName('CSS3 Selectors', '#child-combinators', 'child combinators')}}</td>
+ <td>{{Spec2('CSS3 Selectors')}}</td>
+ <td>Sense canvis</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('CSS2.1', 'selector.html#child-selectors', 'child selectors')}}</td>
+ <td>{{Spec2('CSS2.1')}}</td>
+ <td>Definició inicial</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Navegadors_compatibles">Navegadors compatibles</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<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>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>7.0</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Descripció</th>
+ <th>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>{{CompatUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ </tr>
+ </tbody>
+</table>
+</div>