0
947
ViewsCómo cambiar el color de fondo de pantalla predeterminado de todas las páginas en React JS (Next JS) usando Tailwind CSS
Estoy tratando de cambiar el color de fondo de pantalla predeterminado de todas las páginas de la aplicación web.
Tecnologías que utilicé:
- reaccionar JS
- Siguiente JS
- CSS viento de cola
Quiero que el color de fondo de la pantalla de todas las páginas sea gris claro, como se muestra en la imagen, en lugar del color blanco predeterminado.
¿Hay alguna forma de hacerlo todo a la vez, o necesitamos agregar el color de fondo manualmente a cada página?
3 answers
Answer question0
Si está usando NextJS, puede usar un archivo personalizado _app.jsx (si está usando javascript) o _app.tsx (si está usando TypeScript) para cambiar el color de fondo (y muchos más por cierto) de todos sus páginas web.
Puede crear un div en el archivo y agregar color de fondo a className , se aplicará a todas las páginas que se representen en la aplicación web.
Ejemplo de código:
function MyApp({ Component, pageProps }) { return ( <div className="bg-gray-500"> <Component {...pageProps}/> </div> ); }NextJS tiene una explicación más detallada sobre esto.
0
Puede ir a estilos -> globals.css y allí agregar lo siguiente
html { width: 100%; height: 100%; background-color: {color of your choice}; }Por esto; todas sus páginas tendrán el color de fondo especificado a menos que especifique un color de fondo separado para cualquier componente.
0
Agregar bg-color a un div solo agrega color a un div ... Creo que html { background-color: {color of your choice}; es más probable que produzca el resultado deseado. Tener el mismo problema. Aplicó su solución, pero solo llenó el div que no llegó a la vista de página. Por supuesto, la codificación del comentario anterior es incorrecta. debiera ser:
html { background-color: #yourcolor }