From 4b1a9203c547c019fc5398082ae19a3f3d4c3efe Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:15 -0500 Subject: initial commit --- files/ca/web/css/height/index.html | 236 +++++++++++++++++++++++++++++++++++++ 1 file changed, 236 insertions(+) create mode 100644 files/ca/web/css/height/index.html (limited to 'files/ca/web/css/height') diff --git a/files/ca/web/css/height/index.html b/files/ca/web/css/height/index.html new file mode 100644 index 0000000000..062d09c1fb --- /dev/null +++ b/files/ca/web/css/height/index.html @@ -0,0 +1,236 @@ +--- +title: height +slug: Web/CSS/height +tags: + - CSS + - CSS Property + - Reference +translation_of: Web/CSS/height +--- +
{{CSSRef}}
+ +

La propietat CSS height especifica l'alçada d'un element. Per defecte, la propietat defineix l'alçada de l'àrea de contingut. Si {{cssxref("box-sizing")}} s'estableix a border-box, aquest determina l'alçada de l'àrea de vora.

+ +
/* Keyword value */
+height: auto;
+
+/* <length> values */
+height: 120px;
+height: 10em;
+
+/* <percentage> value */
+height: 75%;
+
+/* Global values */
+height: inherit;
+height: initial;
+height: unset;
+
+ +

Les propietats {{cssxref("min-height")}} i {{cssxref("max-height")}} anul·la {{Cssxref("height")}}.

+ +

{{cssinfo}}

+ +

Sintaxi

+ +

Valors

+ +
+
{{cssxref("<length>")}}
+
Defineix l'alçada com un valor absolut.
+
{{cssxref("<percentage>")}}
+
Defineix l'alçada com un percentatge de l'alçada del bloc contenidor.
+
border-box {{experimental_inline}}
+
Si està present, s'aplica abans {{cssxref("<length>")}} o {{cssxref("<percentage>")}} a la caixa de vora de l'element.
+
content-box {{experimental_inline}}
+
Si està present, s'aplica abans {{cssxref("<length>")}} o {{cssxref("<percentage>")}} a la caixa de contingut de l'element.
+
auto
+
El navegador calcularà i seleccionarà una alçada per a l'element especificat .
+
fill {{experimental_inline}}
+
Utilitzeu la grandària fill-available en línia o la grandària fill-available del bloc, segons correspongui a la modalitat d'escriptura.
+
max-content {{experimental_inline}}
+
L'alçada preferida intrínseca.
+
min-content {{experimental_inline}}
+
L'alçada mínima intrínseca.
+
available {{experimental_inline}}
+
L'alçada del bloc contenidor menys el marge vertical, la vora i el farciment.
+
fit-content {{experimental_inline}}
+
El més gran de: +
    +
  • l'alçada mínima intrínseca.
    • +
  • la menor de l'alçada intrínseca preferida i l'alçada disponible.
    • +
+
+
+ +

Sintaxi formal

+ +
{{csssyntax}}
+ +

Exemple

+ +

HTML

+ +
<div id="red">
+  <span>I'm 50 pixels tall.</span>
+</div>
+<div id="green">
+  <span>I'm 25 pixels tall.</span>
+</div>
+<div id="parent">
+  <div id="child">
+    <span>I'm half the height of my parent.</span>
+  </div>
+</div>
+
+ +

CSS

+ +
div {
+  width: 250px;
+  margin-bottom: 5px;
+  border: 3px solid #999999;
+}
+
+#red {
+  height: 50px;
+}
+
+#green {
+  height: 25px;
+}
+
+#parent {
+  height: 100px;
+}
+
+#child {
+  height: 50%;
+  width: 75%;
+}
+
+ +

{{EmbedLiveSample('Example')}}

+ +

Especificacions

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
EspecificacióEstatComentari
{{SpecName('CSS3 Box', '#the-width-and-height-properties', 'height')}}{{Spec2('CSS3 Box')}}S'han afegit les paraules clau max-content, min-content, available, fit-content, border-box, content-box
{{SpecName('CSS3 Transitions', '#animatable-css', 'height')}}{{Spec2('CSS3 Transitions')}}Mostra height com a animable.
{{SpecName('CSS2.1', 'visudet.html#the-height-property', 'height')}}{{Spec2('CSS2.1')}}Afegeix suport per als valors {{cssxref("<length>")}} i especifica en quin element s'aplica.
{{SpecName('CSS1', '#height', 'height')}}{{Spec2('CSS1')}}Definició inicial
{{SpecName('CSS3 Sizing', '#width-height-keywords', 'width')}}{{Spec2('CSS3 Sizing')}}Afegeix noves paraules clau de grandària per width i height.
+ + + +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
DescripcióChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
Suport bàsic1.0{{CompatVersionUnknown}}{{CompatGeckoDesktop("1")}}4.07.01.0
fill, fit-content, min-content, max-content{{CompatChrome(46.0)}}{{CompatUnknown}}    
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
DescripcióAndroidAndroid WebviewEdgeFirefox Mobile (Gecko)IE PhoneOpera MobileSafari MobileChrome for Android
Suport bàsic1.0{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatGeckoMobile("1")}}6.06.01.0{{CompatVersionUnknown}}
fill, fit-content, min-content, max-content{{CompatUnknown}}{{CompatChrome(46.0)}}{{CompatUnknown}}    {{CompatChrome(46.0)}}
+
+ +

Vegeu també

+ + -- cgit v1.2.3-54-g00ecf