Paso 3: Decorar con CSS
En este punto, el cargador se verá nada más que la imagen inserta. Ahora, vamos a añadir algunos encanto a él mediante el uso de CSS. Dentro de las etiquetas de estilo en la etiqueta head, escribimos en las declaraciones CSS para la etiqueta div, img y el cuerpo .
Asegúrese de tener desbordamiento: oculto en. Otra cosa, la larga cadena de dígitos de Pi hará que una barra de desplazamiento horizontal que se creará. desbordamiento: ocultos significa básicamente que se recortará todo el contenido extra que no cabe en la pantalla de apagado.
La sombra de caja nos permite agregar una sombra al elemento div . Aquí, la sombra es 5 píxeles de largo y ancho y se va a una distancia de 100 píxeles.
Radio frontera da un borde redondeado a nuestro elemento div . Puesto que la altura y la anchura son iguales aquí, los bordes forman un círculo perfecto.
La propiedad de margen superior reduce el div por 150 píxeles. También agregar un píxeles de borde blanco sólido 50 ancho al contenedor. Por último, coloque el envase uno mayor mediante la propiedad z-index . (El valor predeterminado es 1).
Deberá utilizar la propiedad de margen para centrar la imagen dentro del contenedor. He encontrado - 15px y 15px cómodo. Este valor varía con la imagen que utilizas.
