1 files changed, 82 insertions, 0 deletions
diff --git a/files/es/web/css/@media/height/index.html b/files/es/web/css/@media/height/index.html
new file mode 100644
index 0000000000..7cb29fe768
--- /dev/null
+++ b/files/es/web/css/@media/height/index.html
@@ -0,0 +1,82 @@
+---
+title: Altura
+slug: Web/CSS/@media/altura
+tags:
+  - '@media'
+  - CSS
+  - Media Queries
+  - Referencia
+  - características media
+translation_of: Web/CSS/@media/height
+---
+<div>{{cssref}}</div>
+
+<p>Las <a href="/en-US/docs/CSS">CSS</a> <a href="/en-US/docs/Web/CSS/Media_Queries/Using_media_queries#Media_features">media feature (consulta de medios) </a><strong><code>height</code></strong> puede ser usada para aplicar estilos basados en la altura del {{glossary("viewport")}} (o la caja de la página, para <a href="/en-US/docs/Web/CSS/Paged_media">paged media</a>).</p>
+
+<h2 id="Sintáxis">Sintáxis</h2>
+
+<p>La característica <code>height</code> es especificada como un valor {{cssxref("&lt;length&gt;")}} representando la altura de la vista (viewport). Es una característica en rangos, lo que siginifica que puede ser prefijada con las variantes <strong><code>min-height</code></strong> y <code><strong>max-height</strong></code> para consultar valores mínimos y máximos, respectivamente.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;div&gt;Watch this element as you resize your viewport's height.&lt;/div&gt;</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css">/* Altura exacta */
+@media (height: 360px) {
+  div {
+    color: red;
+  }
+}
+
+/* Altura mínima */
+@media (min-height: 25rem) {
+  div {
+    background: yellow;
+  }
+}
+
+/* Altura máxima */
+@media (max-height: 40rem) {
+  div {
+    border: 2px solid blue;
+  }
+}
+</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{EmbedLiveSample('Example','90%')}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('CSS4 Media Queries', '#height', 'height')}}</td>
+   <td>{{Spec2('CSS4 Media Queries')}}</td>
+   <td>El valor ahora puede ser negativo, en cuyo caso se calcula como negativo.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS3 Media Queries', '#height', 'height')}}</td>
+   <td>{{Spec2('CSS3 Media Queries')}}</td>
+   <td>Definición inicial. El valor debe ser positivo.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("css.at-rules.media.height")}}</p>