Propiedad de ancho máximo de CSS
Ejemplo
Establezca el ancho máximo de un elemento <p> en 150 píxeles:
p.ex1 {
max-width: 150px;
}
Más ejemplos de "Pruébelo usted mismo" a continuación.
Definición y uso
La max-width
propiedad define el ancho máximo de un elemento.
Si el contenido es más grande que el ancho máximo, cambiará automáticamente la altura del elemento.
Si el contenido es más pequeño que el ancho máximo, la
max-width
propiedad no tiene efecto.
Nota: Esto evita que el valor de la
propiedad ancho sea mayor que
max-width
. El valor de la
max-width
propiedad anula la propiedad de ancho.
Valor por defecto: | ninguna |
---|---|
Heredado: | No |
Animable: | si, ver propiedades individuales . Leer sobre animable |
Versión: | CSS2 |
Sintaxis de JavaScript: | objeto .style.maxWidth="600px" |
Compatibilidad con navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con la propiedad.
Property | |||||
---|---|---|---|---|---|
max-width | 1.0 | 7.0 | 1.0 | 2.0.2 | 7.0 |
Sintaxis CSS
max-width: none|length|initial|inherit;
Valores de propiedad
Value | Description | Play it |
---|---|---|
none | No maximum width. This is default | |
length | Defines the maximum width in px, cm, etc. Read about length units | |
% | Defines the maximum width in percent of the containing block | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Más ejemplos
Ejemplo
Establezca el ancho máximo de un elemento <p> al 50% del contenedor:
p.ex1 {
max-width: 50%;
}
páginas relacionadas
Tutorial de CSS: altura y ancho de CSS
Referencia de CSS: propiedad min-width
Referencia HTML DOM: propiedad maxWidth