El orden en la propiedad CSS

CSS | Para la propiedad : Aquí, vamos a aprender sobre el orden Propiedad con la sintaxis, ejemplos de CSS (Cascading Style Sheet).

CSS | Para la propiedad

Introducción:

El desarrollo web es un campo cada vez mayor de que nunca encontraría a su fin, por lo tanto, es igualmente necesario para aprender nuevas formas de lidiar con los elementos de la página web o desarrollo web. Tratar con textos, contenedores y varios de tales elementos necesitan su propio conjunto de propiedades y valores. Por lo tanto, mientras que el desarrollo o la creación de una página web o sitio web de debe seguir buscando class formas nuevas e innovadoras para hacer frente a los elementos.

En esta sección se trata de una propiedad que se usa ampliamente, mientras que el uso de elementos flexibles en una página web. ¿Cómo lidiar con esos elementos para hacer la página web o sitio web más sensible será discutido en este artículo. Así que el cinturón de seguridad y obtener for preparada una gran cantidad de conocimiento está llegando a la altura! La propiedad en el debate de hoy es para la propiedad CSS en .

Elaboración:

La propiedad de orden en CSS se utiliza para dar la orden de cada elemento flexible en cuanto a otros elementos flexibles en el recipiente flexible. Si el artículo no es flexible para la propiedad es de ninguna utilidad.

Sintaxis:

    Element{
order : number|initial|inherit;
}

La propiedad de orden no ocupa gran parte de los valores, el único valor que se necesita que se conoce como número . Vamos a entender este valor mucho más claramente.

orden: número

El número valor de la propiedad como su propio nombre indica es usada for usando números o asignando los pedidos hasta el elemento flexible, de modo vamos a pasar más allá con una definición mucho más formal.

Este valor de la propiedad de orden se utiliza para dar la orden de los elementos flexibles y da números correspondientes a cada artículo según el requisito del usuario.

El valor class de este valor es 0.

Sintaxis:

    Element{
order : number;
}

Ejemplo:

<!DOCTYPE html>
<html>
<head>
<style>
#main {
width: 400px;
height: 150px;
border: 1px solid #c3c3c3;
display: flex;
}
#main div {
width: 100px;
height: 100px;
}
div#DIV1 {
order: 2;
}
div#DIV2 {
order: 4;
}
div#DIV3 {
order: 3;
}
div#DIV4 {
order: 1;
}
</style>
</head>
<body>
<h1>The order Property</h1>
<div id="main">
<div style="background-color:green;" id="DIV1"></div>
<div style="background-color:red;" id="DIV2"></div>
<div style="background-color:pink;" id="DIV3"></div>
<div style="background-color:blue;" id="DIV4"></div>
</div>
</body>
</html>

salida

The order Property in CSS - 4

En el ejemplo anterior, se puede ver fácilmente que el orden de cada elemento se da y por lo tanto el elemento se muestra en su orden correspondiente.

Terminar nota:

Aunque esta propiedad puede sonar un poco confuso si se aplica correctamente y sabiamente a continuación, esta propiedad seguramente demostrará ser un activo muy fuerte class el desarrollo y la creación de una página web muy sensible.

Sin embargo, se trata de elementos flexibles puede llegar a ser bastante difícil, pero todos estamos familiarizados con la frase-práctica hace un hombre perfecto! Así que adelante agarrar sus sistemas y empezar a programar!


Deja un comentario

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