blob: dc3adb0cd08a9924ac1222cc117998d4885f7294 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
|
---
title: Model de Caixa CSS
slug: Web/CSS/CSS_Box_Model
tags:
- CSS
- CSS Box Model
- Overview
- Reference
translation_of: Web/CSS/CSS_Box_Model
---
<div>{{CSSRef}}</div>
<p><strong>Model de Caixa CSS</strong> <span id="result_box" lang="ca"><span> és un mòdul de CSS que defineix les caixes rectangulars</span></span> — <span id="result_box" lang="ca"><span>incloent el seu farciment i marge</span></span> —que es generen per als elements i que es defineixen segons el <a href="/en-US/docs/Web/CSS/Visual_formatting_model">model de format visual</a>.</p>
<h2 id="Referència">R<span class="short_text" id="result_box" lang="ca"><span>eferència</span></span></h2>
<h3 id="Propietats">Propietats</h3>
<h4 id="Propietats_que_controlen_el_flux_de_contingut_en_una_caixa">Propietats que controlen el flux de contingut en una caixa</h4>
<div class="index">
<ul>
<li>{{cssxref("box-sizing")}}</li>
<li>{{cssxref("overflow")}}</li>
<li>{{cssxref("overflow-x")}}</li>
<li>{{cssxref("overflow-y")}}</li>
</ul>
</div>
<h4 id="Propietats_que_controlen_la_mida_en_una_caixa">Propietats que controlen la mida en una caixa</h4>
<div class="index">
<ul>
<li>{{cssxref("height")}}</li>
<li>{{cssxref("width")}}</li>
<li>{{cssxref("max-height")}}</li>
<li>{{cssxref("max-width")}}</li>
<li>{{cssxref("min-height")}}</li>
<li>{{cssxref("min-width")}}</li>
</ul>
</div>
<h4 id="Propietats_que_controlen_els_marges_en_una_caixa">Propietats que controlen els marges en una caixa</h4>
<div class="index">
<ul>
<li>{{cssxref("margin")}}</li>
<li>{{cssxref("margin-bottom")}}</li>
<li>{{cssxref("margin-left")}}</li>
<li>{{cssxref("margin-right")}}</li>
<li>{{cssxref("margin-top")}}</li>
</ul>
</div>
<h4 id="Propietats_que_controlen_els_farciments_en_una_caixa">Propietats que controlen els farciments en una caixa</h4>
<div class="index">
<ul>
<li>{{cssxref("padding")}}</li>
<li>{{cssxref("padding-bottom")}}</li>
<li>{{cssxref("padding-left")}}</li>
<li>{{cssxref("padding-right")}}</li>
<li>{{cssxref("padding-top")}}</li>
</ul>
</div>
<h4 id="Altres_propietats">Altres propietats</h4>
<div class="index">
<ul>
<li>{{cssxref("visibility")}}</li>
</ul>
</div>
<h2 id="Guies">Guies</h2>
<dl>
<dt><a href="/en-US/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model">Introducció al model de caixa CSS</a></dt>
<dd>Explica un dels conceptes fonamentals de CSS: el model de caixa. Aquest model defineix com CSS estableix elements, incloent-hi les àrees de contingut, farcit, vora i marge.</dd>
<dt><a href="/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing">Dominar el col.lapse del marge</a></dt>
<dd>De vegades, dos marges adjacents es col·loquen en un. En aquest article es descriuen les regles que regeixen quan i per què passa això i com controlar-lo.</dd>
<dt><a href="/en-US/docs/Web/CSS/Visual_formatting_model">Model de format visual</a></dt>
<dd>Explica el model de format visual.</dd>
</dl>
<h2 id="Especificacions"><span class="short_text" id="result_box" lang="ca"><span>Especificacions</span></span></h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col"><span class="short_text" id="result_box" lang="ca"><span>Especificació</span></span></th>
<th scope="col">Estat</th>
<th scope="col">Comentari</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName("CSS3 Box")}}</td>
<td>{{Spec2("CSS3 Box")}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName("CSS2.1", "box.html")}}</td>
<td>{{Spec2("CSS2.1")}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName("CSS1")}}</td>
<td>{{Spec2("CSS1")}}</td>
<td>Definició inicial</td>
</tr>
</tbody>
</table>
<h2 id="Compatibilitat_dels_navegadors"><span class="short_text" id="result_box" lang="ca"><span>Compatibilitat dels navegadors</span></span></h2>
<p>{{CompatibilityTable}}</p>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Descripció</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari (WebKit)</th>
</tr>
<tr>
<td><span class="short_text" id="result_box" lang="ca"><span>Suport bàsic</span></span></td>
<td>1.0</td>
<td>{{CompatGeckoDesktop("1")}}</td>
<td>3.0</td>
<td>3.5</td>
<td>1.0 (85)</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Descripció</th>
<th>Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td><span class="short_text" id="result_box" lang="ca"><span>Suport bàsic</span></span></td>
<td>1.0</td>
<td>{{CompatGeckoMobile("1")}}</td>
<td>6.0</td>
<td>6.0</td>
<td>1.0</td>
</tr>
</tbody>
</table>
</div>
|