-
Cómo traer una imagen hacia adelante en CSS
-
Al diseñar páginas web, la imagen en su sitio puede ser solapado por el texto y otros contenidos en la página. Afortunadamente, usted tiene la capacidad de llevar la imagen utilizando adelante Cascading Style Sheets (CSS). Con CSS, se utiliza el atributo z-index, similar a la capacidad "traer al frente" de un programa de procesamiento de textos, para posicionar sus gráficos. Usar editor de texto de su equipo para aplicar el CSS que modifica la posición de la imagen.Instrucciones
1 Lanzamiento de su editor de texto y abrir el archivo de sitio web que contiene la imagen que desea modificar.
2 Escriba el siguiente código CSS después de la apertura etiqueta <head>:
<Style type = "text / css">
</ Style>
3 Coloque el cursor entre los elementos de estilo e introduzca un signo de número seguido por un término de su elección (por ejemplo, "#forward"). Escriba un par de llaves después de su entrada como se ve aquí para crear la regla de estilo para su imagen:
adelante { }
El signo de número crea un Número de Identificación del CSS, lo que le permite diseñar una regla distinta para una imagen en particular en su página.4 Enter "position: absolute;" entre los corchetes para indicar al navegador para visualizar su imagen exactamente donde se especifica. Además, el tipo "z-index:" e introduzca un valor positivo en píxeles (px), así:
hacia adelante {position: absolute; z-index: 5px; }
El índice z determina qué orden pila aparece la imagen; Por lo tanto, un mayor valor positivo especifica la imagen se adelanta primero.5 Busque el código de la imagen que desea asignar la regla de estilo CSS y escriba "id = # avanzar" dentro de la etiqueta. Por ejemplo:
<Img id = "# avanzar" />
Asegúrese de reemplazar "#forward" con el nombre de su propia regla CSS.
6 Guarde el archivo y la vista previa de su trabajo en un navegador Web para ver la nueva posición de la imagen.
