diff options
Diffstat (limited to 'files/ca/web/css/referéncia_css/index.html')
-rw-r--r-- | files/ca/web/css/referéncia_css/index.html | 206 |
1 files changed, 206 insertions, 0 deletions
diff --git a/files/ca/web/css/referéncia_css/index.html b/files/ca/web/css/referéncia_css/index.html new file mode 100644 index 0000000000..739dcdc9e3 --- /dev/null +++ b/files/ca/web/css/referéncia_css/index.html @@ -0,0 +1,206 @@ +--- +title: Referéncia CSS +slug: Web/CSS/Referéncia_CSS +tags: + - CSS + - Reference + - 'l10n:priority' +translation_of: Web/CSS/Reference +--- +<p class="summary"><span id="result_box" lang="ca"><span>Utilitzeu aquesta referència CSS per explorar un</span></span> <a href="#Keyword_index">índex alfabètic</a> <span id="result_box" lang="ca"><span>de totes les propietats</span></span> <a href="/en-US/docs/Web/CSS">CSS</a> <span id="result_box" lang="ca"><span>estàndard</span></span> , <a href="/en-US/docs/Web/CSS/Pseudo-classes">pseudo-classes</a>, <a href="/en-US/docs/Web/CSS/Pseudo-elements">pseudo-elements</a>, <a href="/en-US/docs/Web/CSS/CSS_Types">tipus de dades</a>, i <a href="/en-US/docs/Web/CSS/At-rule">regles-at</a>. <span id="result_box" lang="ca"><span>També podeu explorar una llista de tots els </span></span> <a href="#Selectors">selectors CSS organitzats per tipus</a> i una llista de <a href="#Concepts">conceptes clau CSS</a>. <span id="result_box" lang="ca"><span>També s'inclou una breu</span></span> <a href="#DOM-CSS_CSSOM">referència DOM-CSS / CSSOM</a>.</p> + +<h2 id="Sintaxi_de_regla_bàsica"><span class="short_text" id="result_box" lang="ca"><span>Sintaxi de regla bàsica</span></span></h2> + +<h3 id="Sintaxi_de_regla_d'estil"><span class="short_text" id="result_box" lang="ca"><span>Sintaxi de regla d'estil</span></span></h3> + +<pre class="syntaxbox"><strong><var>selectorlist</var> { + <var>property</var>: <var>value</var>;</strong> + <var>[more property:value; pairs]</var> +<strong>}</strong> + +... where <var>selectorlist</var> is: <var>selector[:pseudo-class] [::pseudo-element] [, more selectorlists]</var> + +See <a href="#Selectors"><em>selector</em></a>, <a href="#pcls"><em>pseudo-class</em></a>, <em><a href="#pelm">pseudo-element</a></em> lists below. +</pre> + +<h4 id="Exemples_de_regla_d'estil"><span id="result_box" lang="ca"><span>Exemples de regla d'estil</span></span></h4> + +<pre class="brush: css">strong { + color: red; +} + +div.menu-bar li:hover > ul { + display: block; +} +</pre> + +<p>Per a una introducció a nivell de principiant a la sintaxi de selectors CSS, consulteu <a href="/en-US/docs/Learn/CSS/Introduction_to_CSS/Selectors">aquest tutorial</a>. Tingueu en compte que qualsevol error de <a href="/en-US/docs/Web/CSS/syntax">sintaxi CSS</a> en una definició de regla invalida tota la regla. Les regles no vàlides són ignorades pel navegador. Tingueu en compte que les definicions de la regla CSS són totalment <a href="https://www.w3.org/TR/css-syntax-3/#intro">basades en text</a> (ASCII), mentre que DOM-CSS / CSSOM (el sistema de gestió de regles) està <a href="https://www.w3.org/TR/cssom/#introduction">basat en objectes</a>.</p> + +<h3 id="Sintaxi_de_regla-At_(At-rule)">Sintaxi de regla-At (At-rule)</h3> + +<p>As the structure of at-rules varies widely, please see <a href="/en-US/docs/Web/CSS/At-rule">At-rule</a> to find the syntax of the specific one you want.</p> + +<h2 id="Índex_de_paraules_clau_(Keyword)"><span class="short_text" id="result_box" lang="ca"><span>Índex de paraules clau</span></span> (Keyword)</h2> + +<div>{{CSS_Ref}}</div> + +<h2 id="Selectors">Selectors</h2> + +<h3 id="Selectors_Bàsics"><a href="/en-US/docs/Web/CSS/CSS_Selectors#Basic_selectors">Selectors Bàsics</a></h3> + +<ul> + <li><a href="/en-US/docs/Web/CSS/Type_selectors">Selector de Tipus</a> <code>elementname</code></li> + <li><a href="/en-US/docs/Web/CSS/Class_selectors">Selector Class</a> <code>.classname</code></li> + <li><a href="/en-US/docs/Web/CSS/ID_selectors">Selector ID</a> <code>#idname</code></li> + <li><a href="/en-US/docs/Web/CSS/Universal_selectors">Selector Universal</a> <code>*</code> <code>ns|*</code> <code>*|*</code></li> + <li><a href="/en-US/docs/Web/CSS/Attribute_selectors">Selector d'Attribute</a> <code>[attr=value]</code></li> +</ul> + +<h3 id="Combinadors"><a href="/en-US/docs/Web/CSS/CSS_Selectors#Combinators">Combinadors</a></h3> + +<ul> + <li><a href="/en-US/docs/Web/CSS/Adjacent_sibling_selectors">Combinador de germans Adjacents</a> <code>A + B</code></li> + <li><a href="/en-US/docs/Web/CSS/General_sibling_selectors">Combinador de germans General</a> <code>A ~ B</code></li> + <li><a href="/en-US/docs/Web/CSS/Child_selectors">Combinador de Fills</a> <code>A > B</code></li> + <li><a href="/en-US/docs/Web/CSS/Descendant_selectors">Combinador de Descendents</a> <code>A B</code></li> +</ul> + +<h3 id="Pseudo-classes"><a href="/en-US/docs/Web/CSS/Pseudo-classes">Pseudo-classes</a></h3> + +<div class="index"> +<ul> + <li id="pcls">{{ Cssxref(":active") }}</li> + <li>{{cssxref(':any')}}</li> + <li>{{cssxref(':any-link')}}</li> + <li>{{ Cssxref(":checked") }}</li> + <li>{{ Cssxref(":default") }}</li> + <li>{{ Cssxref(":dir", ":dir()")}}</li> + <li>{{ Cssxref(":disabled") }}</li> + <li>{{ Cssxref(":empty") }}</li> + <li>{{ Cssxref(":enabled") }}</li> + <li>{{ Cssxref(":first") }}</li> + <li>{{ Cssxref(":first-child") }}</li> + <li>{{ Cssxref(":first-of-type") }}</li> + <li>{{ Cssxref(":fullscreen") }}</li> + <li>{{ Cssxref(":focus") }}</li> + <li>{{ Cssxref(":hover") }}</li> + <li>{{ Cssxref(":indeterminate") }}</li> + <li>{{ Cssxref(":in-range") }}</li> + <li>{{ Cssxref(":invalid") }}</li> + <li>{{ Cssxref(":lang", ":lang()") }}</li> + <li>{{ Cssxref(":last-child") }}</li> + <li>{{ Cssxref(":last-of-type") }}</li> + <li>{{ Cssxref(":left") }}</li> + <li>{{ Cssxref(":link") }}</li> + <li>{{ Cssxref(":not", ":not()") }}</li> + <li>{{ Cssxref(":nth-child", ":nth-child()") }}</li> + <li>{{ Cssxref(":nth-last-child", ":nth-last-child()") }}</li> + <li>{{ Cssxref(":nth-last-of-type", ":nth-last-of-type()") }}</li> + <li>{{ Cssxref(":nth-of-type", ":nth-of-type()") }}</li> + <li>{{ Cssxref(":only-child") }}</li> + <li>{{ Cssxref(":only-of-type") }}</li> + <li>{{ Cssxref(":optional") }}</li> + <li>{{ Cssxref(":out-of-range") }}</li> + <li>{{ Cssxref(":read-only") }}</li> + <li>{{ Cssxref(":read-write") }}</li> + <li>{{ Cssxref(":required") }}</li> + <li>{{ Cssxref(":right") }}</li> + <li>{{ Cssxref(":root") }}</li> + <li>{{ Cssxref(":scope") }}</li> + <li>{{ Cssxref(":target") }}</li> + <li>{{ Cssxref(":valid") }}</li> + <li>{{ Cssxref(":visited") }}</li> +</ul> +</div> + +<h3 id="Pseudo-elements"><a href="/en-US/docs/Web/CSS/Pseudo-elements">Pseudo-elements</a></h3> + +<div class="index"> +<ul> + <li id="pelm">{{ Cssxref("::after") }}</li> + <li>{{ Cssxref("::backdrop") }}</li> + <li>{{ Cssxref("::before") }}</li> + <li>{{ Cssxref("::cue") }}</li> + <li>{{ Cssxref("::first-letter") }}</li> + <li>{{ Cssxref("::first-line") }}</li> + <li>{{ Cssxref("::grammar-error") }} {{experimental_inline}}</li> + <li>{{ Cssxref("::marker") }} {{experimental_inline}}</li> + <li>{{ Cssxref("::placeholder") }} {{experimental_inline}}</li> + <li>{{ Cssxref("::selection") }}</li> + <li>{{ Cssxref("::spelling-error") }} {{experimental_inline}}</li> +</ul> +</div> + +<div class="note"> +<p><strong>Vegeu també:</strong> Una <a href="https://www.w3.org/TR/selectors/#selectors">llista completa de selectors</a> en l'especificació Selectors Level 3.</p> +</div> + +<h2 id="Conceptes">Conceptes</h2> + +<h3 id="Sintaxi_i_semàntica"><span class="short_text" id="result_box" lang="ca"><span>Sintaxi i semàntica</span></span></h3> + +<ul> + <li><a href="/en-US/docs/Web/CSS/Syntax">Sintaxi CSS</a></li> + <li><a href="/en-US/docs/Web/CSS/At-rule">Regles-At</a></li> + <li><a href="/en-US/docs/Web/CSS/Cascade">Cascada</a></li> + <li><a href="/en-US/docs/Web/CSS/Comments">Comentaris</a></li> + <li><a href="/en-US/docs/Glossary/Descriptor_(CSS)">Descriptor</a></li> + <li><a href="/en-US/docs/Web/CSS/inheritance">Herència</a></li> + <li><a href="/en-US/docs/Web/CSS/Shorthand_properties">Propietats abreujades</a></li> + <li><a href="/en-US/docs/Web/CSS/Specificity">Especificitat</a></li> + <li><a href="/en-US/docs/Web/CSS/Value_definition_syntax">Sintaxi de definció de valor</a></li> +</ul> + +<h3 id="Valors">Valors</h3> + +<ul> + <li><a href="/en-US/docs/Web/CSS/actual_value">Valor Real</a></li> + <li><a href="/en-US/docs/Web/CSS/computed_value">Valor Calculat</a></li> + <li><a href="/en-US/docs/Web/CSS/initial_value">Valor Inicial</a></li> + <li><a href="/en-US/docs/Web/CSS/resolved_value">Valor Resolt</a></li> + <li><a href="/en-US/docs/Web/CSS/specified_value">Valor Especificat</a></li> + <li><a href="/en-US/docs/Web/CSS/used_value">Valor Usat</a></li> +</ul> + +<h3 id="Disseny">Disseny</h3> + +<ul> + <li><a href="/en-US/docs/Web/Guide/CSS/Block_formatting_context">Context de format de bloc</a></li> + <li><a href="/en-US/docs/Web/CSS/box_model">Model Caixa</a></li> + <li><a href="/en-US/docs/Web/CSS/All_About_The_Containing_Block">Bloc contenidor</a></li> + <li><a href="/en-US/docs/Web/CSS/Layout_mode">Mode de presentació</a></li> + <li><a href="/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing">Col.lapsant el Marge</a></li> + <li><a href="/en-US/docs/Web/CSS/Replaced_element">Elements Reemplaçats</a></li> + <li><a href="/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context">Context d'Apilament</a></li> + <li><a href="/en-US/docs/Web/Guide/CSS/Visual_formatting_model">Model de format Visual</a></li> +</ul> + +<h2 id="DOM-CSS_CSSOM">DOM-CSS / CSSOM</h2> + +<h3 id="Tipus_d'objectes_principals"><span class="short_text" id="result_box" lang="ca"><span>Tipus d'objectes principals</span></span></h3> + +<ul> + <li>document.<a href="/en-US/docs/Web/API/Document/styleSheets">styleSheets</a></li> + <li>styleSheets[i].<a href="/en-US/docs/Web/API/CSSRuleList">cssRules</a></li> + <li>cssRules[i].<a href="/en-US/docs/Web/API/CSSRule/cssText">cssText</a> (selector & style)</li> + <li>cssRules[i].<a href="/en-US/docs/Web/API/CSSStyleRule/selectorText">selectorText</a></li> + <li>elem.<a href="/en-US/docs/Web/API/HTMLElement/style">style</a></li> + <li>elem.style.<a href="/en-US/docs/Web/API/CSSStyleDeclaration/cssText">cssText</a> (just style)</li> + <li>elem.<a href="/en-US/docs/Web/API/Element/className">className</a></li> + <li>elem.<a href="/en-US/docs/Web/API/Element/classList">classList</a></li> +</ul> + +<h3 id="Mètodes_importants"><span class="short_text" id="result_box" lang="ca"><span>Mètodes importants</span></span></h3> + +<ul> + <li>{{domxref("CSSStyleSheet.insertRule")}}</li> + <li>{{domxref("CSSStyleSheet.deleteRule")}}</li> +</ul> + +<h2 id="Vegeu_també"><span class="short_text" id="result_box" lang="ca"><span>Vegeu també</span></span></h2> + +<ul> + <li><a href="/en-US/docs/Web/CSS/Mozilla_Extensions">Mozilla CSS extensions</a> (prefixades amb <code>-moz</code>)</li> + <li><a href="/en-US/docs/Web/CSS/Webkit_Extensions">WebKit CSS extensions</a> ( <span id="result_box" lang="ca"><span>majoritàriament prefixades amb</span></span> <code>-webkit</code>)</li> + <li><a href="/en-US/docs/Web/CSS/Microsoft_CSS_extensions">Microsoft CSS extensions</a> (prefixades amb <code>-ms</code>)</li> +</ul> |