CSS3 - Cómo "restaurar" :: - propiedad webkit-scrollbar a la barra de desplazamiento predeterminada

Question

Hola, estoy usando el siguiente código CSS para crear estilos de barras de desplazamiento en Safari y Chrome. Y funciona realmente bien, pero estoy enfrentando el próximo problema, me gustaría restaurar el valor predeterminado, cuando veo el sitio en mi ipad. Estoy usando @media css para lograr esto, pero no sé cómo restaurar los valores predeterminados.

@media screen and (min-width: 768px) and (max-width: 1024px) { } 



/*Scroll bar nav*/ 
::-webkit-scrollbar { 
    width: 12px; 
} 

/* Track */ 
::-webkit-scrollbar-track { 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    -webkit-border-radius: 10px; 
    border-radius: 10px; 
    background:#FFF;  
} 

/* Handle */ 
::-webkit-scrollbar-thumb { 
    -webkit-border-radius: 10px; 
    border-radius: 10px; 
    background: rgba(204,204,204,0.8); 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
} 
::-webkit-scrollbar-thumb:window-inactive { 
    background: rgba(204,204,204,0.4); 
} 

Answer 1

Hola Acabo de darme cuenta de que puede establecer todas las propiedades en automático; y hará el truco. Esta es una carta personal, pero creo que algún día alguien puede tener la misma pregunta.

/*Scroll bar nav*/ 
::-webkit-scrollbar { 
    width: auto; 
} 

/* Track */ 
::-webkit-scrollbar-track { 
    -webkit-box-shadow: auto; 
    -webkit-border-radius: auto; 
    border-radius: auto; 
    background:auto;  
} 

/* Handle */ 
::-webkit-scrollbar-thumb { 
    -webkit-border-radius:auto; 
    border-radius:auto; 
    background:auto; 
    -webkit-box-shadow:auto; 
} 
::-webkit-scrollbar-thumb:window-inactive { 
    background: auto; 
} 

No sé si existe otro método.

- ACTUALIZACIÓN - ves como si también se puede utilizar el valor initial y unset // revierten todos los valores

::-webkit-scrollbar { 
    all:unset; 
} 

o aplicar a una determinada uno {width : unset} || {width : initial}

Answer 2

Utilice la initial valueunset value o de las propiedades que desea revertir (dependiendo de cómo es exactamente lo que desea revertir los).

Ambos valores se pueden aplicar a todas las propiedades de CSS.

ejemplo

::-webkit-scrollbar { 
    width: initial; 
} 

o

::-webkit-scrollbar { 
    width: unset; 
} 

---

Si desea revertir todas las propiedades de una regla, entonces debería usar el ejemplo all keyword

::-webkit-scrollbar-thumb { 
    all:unset; 
} 

---

Aviso: No se apoyo IE para cualquiera de éstos hasta el momento.
Diferentes niveles de soporte para cada navegador (consulte los documentos vinculados para obtener más información)