la propiedad de ancho máximo en CSS

CSS | la propiedad de ancho máximo : Aquí, vamos a aprender acerca de la propiedad ancho máximo con el ejemplo de CSS (Cascading Style Sheet).

CSS | propiedad max-anchura

El propiedad max-anchura se utiliza para ayudar en la fijación del ancho de un elemento al máximo. Aunque si el elemento o contenido ya es mayor que la anchura máxima entonces se cambia la altura de ese contenido o elemento.

El propiedad max-anchura no funciona en el contenido que es menor que la anchura máxima. La propiedad anchura máxima reemplaza la propiedad de ancho. El valor de la class ancho máximo propiedad hay ninguno. La anchura del elemento se puede medir en términos de % , px , cm o ninguno .

Sintaxis:

    Element
{
max-width : 50% / 50px /50cm etc.
}

Ejemplo:

<!DOCTYPE html>
<html>
<head>
<style>
.element1 {
background-color: #f40;
color: #ffffff;
max-width: 50%;
}
.element2 {
background-color: #f40;
color: #ffffff;
max-width: 200px;
}
.element3 {
background-color: #f40;
color: #ffffff;
max-width: 300px;
}
</style>
</head>
<body>
<div class="element1">
<p>This is sample text in element1 DIV.</p>
</div>
<div class="element2">
<p>This is sample text in element2 DIV.</p>
</div>
<div class="element3">
<p>This is sample text in element3 DIV.</p>
</div>
</body>
</html>

salida

max-width property in CSS - 4

En el ejemplo anterior, hay tres clases CSS element1 , elemento2 y Element3 y aplicada max-anchura son 50% , 200 px y 300px respectivamente.

valores de la propiedad

Valor
Descripción

ninguno No hay anchura máxima. Esta es default.
longitud Define la anchura máxima en px, cm, etc.
% Este se utiliza para definir la anchura máxima en porcentaje de la bloque de contención.
inicial Este conjuntos esta propiedad a su valor class.
hereda Este hereda esta propiedad de su elemento padre.

Por lo tanto, la propiedad ancho máximo es muy útil cuando se desea el estilo de su elemento de una manera muy específica, es decir, para ajustar la anchura.

A veces un sitio web se centra más en su class contenido de la audiencia, quieren que su contenido sea completa y legible. Esos sitios web tienden a mantener el ancho de su contenido un poco grande.

Pero no en todas partes esta propiedad se puede aplicar ya que no quiere que su sitio torpe mirada o congestionado. Por lo tanto, hay que tener mucho cuidado al usar esta propiedad para decidir dónde usarlo.


Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *