Los datos expuestos en este blog, son solo de índole informativo. Por favor realiza siempre una copia de seguridad antes de realizar cualquier cambio en tu proyecto.
CSS: propiedad de ancho máximo
Este tutorial de CSS explica cómo usar una propiedad de CSS llamada ancho máximo Con sintaxis y ejemplos.
describir
La propiedad max-width de CSS define el ancho máximo del área de contenido de un elemento.
sintaxis
La sintaxis de la propiedad CSS max-width es:
max-width: value;parámetro o parámetro
valor
El ancho máximo del área de contenido del elemento. Puede ser uno de los siguientes:
| valor | describir |
|---|---|
| estable | Un valor fijo en píxeles, em, etc. div { ancho máximo: 150px; } div {ancho máximo: 50em; } |
| porcentaje | valor porcentual div { ancho máximo: 90%; } |
| no cualquiera | Sin ancho máximo aplicado al elemento div { ancho máximo: ninguno; } |
| heredar | Indica que el elemento heredará el ancho máximo de su elemento padre div { ancho máximo: heredar; } |
notas
- El área de contenido de un elemento está dentro del relleno, los bordes y los márgenes del elemento.
- La propiedad max-width de CSS se aplica a los elementos de nivel de bloque y reemplazados.
- La propiedad de ancho máximo de CSS se usa para evitar que el ancho de CSS sea mayor que el valor especificado en la propiedad de ancho máximo de CSS.
- Cuando el valor se proporciona como un porcentaje, es relativo al ancho del bloque que lo contiene.
- Véase también alto, ancho, alto máximo, alto mínimo, ancho mínimo.
Compatibilidad del navegador
La propiedad max-width de CSS tiene soporte básico para los siguientes navegadores:
- Aleación de cromo
- androide
- Firefox (Geco)
- Firefox móvil (Geco)
- Navegador de Internet (IE)
- es decir, móvil
- ópera
- Ópera Móvil
- Safari (WebKit)
- Safari para móvil
ejemplo
Discutiremos la propiedad max-width a continuación, explorando ejemplos de cómo usar esta propiedad en CSS.
usar valor fijo
Veamos un ejemplo de ancho máximo de CSS, donde proporcionamos el ancho máximo como un valor fijo en píxeles.
div { max-width: 200px; }En este ejemplo de ancho máximo de CSS,
También podemos expresar el ancho máximo como un valor fijo en em.
Por ejemplo:
div { max-width: 175em; }En este ejemplo de ancho máximo de CSS,
porcentaje de uso
Veamos un ejemplo de ancho máximo de CSS donde proporcionamos el ancho máximo como un porcentaje.
div { max-width: 90% }En este ejemplo de ancho máximo de CSS,
No utilice
Veamos un ejemplo de ancho máximo de CSS, donde usamos none como valor de ancho máximo.
div { max-width: none; }En este ejemplo de ancho máximo de CSS, no hay derecho