La propiedad max-width en CSS establece el ancho máximo de un elemento y evita que el valor usado de la propiedad width exceda el valor especificado en la propiedad max-width.
Funciones max-width css
| Valor inicial | none |
|---|---|
| Aplicado a | Todos los elementos, excepto los elementos en línea no reemplazados, las columnas de la tabla y los grupos de columnas. |
| Heredable | No |
| Móvil | Sí |
| Valor calculado | Porcentaje, longitud absoluta o palabra reservada none. |
/*longitudes */ max-width: 3.5em; /* porcentajes */ max-width: 75%; /* palabras reservadas */ max-width: none; /* valores globales */ max-width: inherit; max-width: initial; max-width: unset;
La propiedad max-width tiene prioridad sobre la propiedad width, pero la propiedad min-width tiene prioridad sobre max-width.
Ejemplos y aplicaciones en código
Usaremos el siguiente ejemplo, un elemento Código CSS: No hay un ancho máximo para este artículo. Especifique el ancho máximo en longitudes absolutas. Especifica el ancho máximo como porcentaje del ancho del elemento de bloque que contiene el elemento actual. Si la altura de ese elemento no se especifica claramente, el valor porcentual se trata como cero.70% elemento de visualización que lo contiene, sin exceder el valor de la propiedad de visualización max-width, a saber 700px:< div >
Contenido en texto
div {
width: 70%;
max-width: 700px;
}Soporte de navegadores
Característica Chrome Firefox IE Ópera Safari Soporte básico 1.0 1.0 7.0 7.0 1.0 Características generales
none
Estructura max-width css
max-width:
Consulte también
width, height que se encarga de configurar las dimensiones del elemento.max-height que establece la altura mínima del elemento.min-height que establece la altura mínima del elemento.min-width que establece el ancho mínimo del elemento.
