CSS establece el color y el estilo de la barra de desplazamiento y cómo eliminar y ocultar las barras de desplazamiento
Utilice CSS para configurar el color de la barra de desplazamiento y cómo eliminar la barra de desplazamiento: div?{?
scrollbar-face-color:?#fcfcfc;?
barra de desplazamiento-color-resaltado:?#6c6c90;?
barra de desplazamiento-color-sombra:?#fcfcfc;?
barra de desplazamiento-3dlight-color:?#fcfcfc;?
color-flecha-barra-desplazamiento:?#240024;?
color-pista-barra-desplazamiento:?#fcfcfc;?
color-sombra-oscura-barra-desplazamiento:?# 48486c; ?
scrollbar-base-color:?#fcfcfc?
}
El estilo de la barra de desplazamiento implica principalmente las siguientes propiedades CSS:?
atributo de desbordamiento: ¿Recuperar o establecer cómo mostrar el contenido cuando el contenido del objeto excede su altura y ancho especificados?
overflow: auto ¿El contenido agregará automáticamente barras de desplazamiento cuando sea necesario?
overflow: scroll; ¿Mostrar siempre barras de desplazamiento?
overflow-x: oculto; ¿Desactivar barras de desplazamiento horizontales?
overflow-y: mostrar siempre barras de desplazamiento verticales; ?
ancho: 568px; ancho: 98; Establecer el ancho del área [píxeles/porcentaje, etc.]?
alto: 120px; /porcentaje, etc.]?lt ;ESTILOgt;?
CUERPO?{?
BARRA DE DESPLAZAMIENTO-COLOR-CARA:?#f892cc;?
BARRA DE DESPLAZAMIENTO- COLOR DE DESTACADO:?#f256c6; ?
COLOR-DE-SOMBRA-BARRA DE DESPLAZAMIENTO:?#fd76c2;?
COLOR-DE-LUZ-3D DE LA BARRA DE DESPLAZAMIENTO:?#fd76c2;?
COLOR DE LA FLECHA DE LA BARRA DE DESPLAZAMIENTO: ?#fd76c2;?
COLOR DE LA PISTA DE LA BARRA DE DESPLAZAMIENTO:?#fd76c2;?
COLOR DE LA SOMBRA OSCURA DE LA BARRA DE DESPLAZAMIENTO:?#f629b9;?
BARRA DE DESPLAZAMIENTO-COLOR-BASE：?#e9cfe0?
}?
lt;/STYLEgt;
BARRA DE DESPLAZAMIENTO-COLOR-CARA: ¿El color de la parte elevada de la barra de desplazamiento?
SCROLLBAR-HIGHLIGHT-COLOR: ¿El color de la parte en blanco de la barra de desplazamiento?
SCROLLBAR-SHADOW-COLOR: El color de la sombra de la barra de desplazamiento tridimensional?
SCROLLBAR-3DLIGHT -COLOR: ¿El color del borde brillante de la barra de desplazamiento?
SCROLLBAR-ARROW-COLOR: El color de las flechas triangulares en los botones arriba y abajo?
SCROLLBAR-TRACK-COLOR: ¿El color de fondo de la barra de desplazamiento?
SCROLLBAR-DARKSHADOW-COLOR: ¿El color del desplazamiento? ¿La fuerte sombra de la barra?
SCROLLBAR-BASE-COLO
R: El color básico de la barra de desplazamiento
Eliminar la barra de desplazamiento en la página web:?
Eliminar la barra de desplazamiento horizontal: lt; body style='overflow: scroll overflow; -x: oculto'gt ;?
Eliminar la barra de desplazamiento vertical: lt; body style='overflow: scroll; overflow-y: oculto'gt;?
Eliminar ambos: lt; body scroll ="no"gt;?
Agregue la barra de desplazamiento en el medio del cuadro y agregue scrolling="No" después de name=""?
1. ¿Configuración cuando el contenido desbordado se desborda?
¿Configuración de desbordamiento cuando el contenido horizontal y vertical se desborda?
overflow-x ¿Configuración cuando el contenido horizontal se desborda?
overflow-y Cuando es vertical ¿Configuración de desbordamiento de contenido?
¿Los valores de los tres atributos anteriores son visibles, desplazamiento, oculto, automático?
El valor predeterminado de visible. Cuando se utiliza este valor, no importa cuáles sean los valores de "ancho" y "alto"?
están establecidos, el contenido se verá obligado a mostrarse independientemente de si excede el rango. ?
El efecto de oculto es opuesto al visible. ¿Algún contenido más allá del "ancho" y el "alto"?
será invisible. ?
desplazamiento Las barras de desplazamiento se mostrarán independientemente de si el contenido excede el alcance. ?
auto Cuando el contenido excede el rango, se muestra la barra de desplazamiento; de lo contrario, no se muestra.
Aplicación:?
Sin barra de desplazamiento horizontal:?
lt;div style="overflow-x:hidden"gt;testlt;/divgt;? /p>
¿Sin barra de desplazamiento vertical?
lt;div style="overflow-y:hidden"gt;testlt;/divgt;?
¿Sin barra de desplazamiento
lt;div style="overflow-x:hidden;overflow-y:hidden" o style="overflow:hidden"gt;testlt;/divgt;?
Desplazamiento de visualización automática bar?
lt;divstyle="height: 100px; width: 100px; overflow: auto;"gt; testlt;/divgt;?
2, define tú mismo el color de la barra de desplazamiento ?
Nuestro estilo de barra de desplazamiento predeterminado general es el que se muestra a la izquierda. La imagen de la derecha está ampliada 1600 veces. Podemos ver que hay varias combinaciones de barras de desplazamiento. Las marqué con 7 números. p>
se comentan después del siguiente código CSS. Tenga en cuenta que el código de comentario CSS se coloca entre dos asteriscos dentro de dos barras, como por ejemplo: ?Body?{?
scrollbar-arrow-color:? #f4ae21;?
barra de desplazamiento-color-cara:?#333;?
barra de desplazamiento-3dlight-color:?#666;?
barra de desplazamiento-resaltado -color:?#666;?
barra de desplazamiento-sombra-color:?#999;?
barra de desplazamiento-sombra oscura -color:?#666;?
barra de desplazamiento-color-de pista:?#666;?
}