Cómo hacer una barra flotante en CSS

Creación de una variable bar es un método para mantener el contenido de una posición fija en su página Web. Puede utilizar una variable bar para mantener un menú de navegación muy útil para sus visitantes o, puede molestar a la gente con un anuncio que se queda en su pantalla sin importar dónde se desplazan en una página de largo. Independientemente de su motivación, el código CSS para crear una barra flotante es simple y se puede agregar a su sitio web en tan sólo unos minutos. 

FLOTA

Definir la barra flotante CSS en la sección head del código HTML. Comience con una etiqueta de estilo y definir un div para sostener la barra flotante:

estilo div.floating-bar {position: fixed; fondo: # 808080; border: 1px solid # 000000; ancho 100%, z-index: 100;}

Asignar a los miembros al elemento div y la posición de la barra en la pantalla con el código:

div.floating-bar h3 {display: block; margen: 0 0,5 em;} / estilo

Inserte la barra flotante en la sección del cuerpo de su código y poner un poco de texto en la barra:

div class = flotante bar h3Floating Bar/h3 / div

Consejos y advertencias

Este código crea una barra flotante con el Floating Bar texto. Crear un menú insertando las etiquetas de anclaje adecuados. También puede utilizar la barra para mostrar imágenes, texto o una combinación de los tres.

Ajuste el índice z de 100 mantiene la barra que aparece en la parte superior de cualquier otra página que el usuario se desplaza hacia abajo la página.

Ajuste de la posición: fijo mantiene la barra en su lugar con respecto a la pantalla de los usuarios para crear un efecto flotante.