Mis pensamientos sobre el marco CSS y los módulos CSS siempre han sido vagos y sigo completamente la tendencia. Los problemas que encontré en el trabajo recientemente me obligaron a prestar atención a este tema. Estoy acostumbrado a que una sola persona haga todo, planificar, diseñar y publicar la página. Cuando un proyecto requiere que varias personas colaboren y lo completen en poco tiempo, la planificación de los archivos de estilo y el pensamiento de los módulos y marcos CSS son particularmente importantes.
La siguiente pregunta me ha estado molestando recientemente: si varias personas están trabajando en la recepción de un sitio web al mismo tiempo, cómo distribuirlas para que el estilo de todo el sitio web esté unificado, la estructura del archivo de estilo sea razonable, hay ¿Sin duplicaciones ni redundancias y la eficiencia es la más alta? Consulté a varios compañeros de clase y las respuestas que obtuve se resumen a continuación: en términos de unificación de estilos, discutimos juntos para hacer un boceto primero, y una persona hizo una página de estilo estándar basada en el boceto, y luego comenzamos a trabajar juntos. y el resto fue modificación constante. En términos de producción, se configuran varios archivos CSS diferentes para todo el sitio y cada persona es responsable de diferentes archivos de estilo.
Lo que es fácil de decir no lo es tanto una vez implementado. Cuando se trata de diseño, todavía no me atrevo a correr riesgos. Afortunadamente, no hay muchas páginas. Hay menos de 20 páginas de primer y segundo nivel en total, y una persona puede manejarlas. Cuéntanos sobre el proceso de producción.
(1) Estandarizar los nombres CSS, el orden de escritura y los comentarios.
Sin mencionar la importancia de este punto, es difícil imaginar lo confuso que sería que varios métodos de nombres "fuertemente personalizados" aparecieran en una hoja de estilo al mismo tiempo. Los nombres pueden utilizar la conexión del símbolo medio "-", "_", como cuadro de texto, contenido de texto, cuadro de texto o escritura en mayúsculas y minúsculas "joroba", cuadro de texto, contenido de texto, etc. Los comentarios son muy importantes. Los comentarios se pueden dividir en tres niveles. Las categorías principales de comentarios se utilizan para dividir los bloques CSS, como las anotaciones de encabezado, contenedor y pie de página, las anotaciones de módulo local en categorías principales y las anotaciones de tercera categoría. anotado dentro de un selector. Use comentarios o piratee comentarios en algunos efectos especiales. El formato de escritura puede utilizar sangría horizontal para mostrar relaciones jerárquicas.
(2) Determinar la división estructural de la hoja de estilo según las representaciones.
Hay muchas introducciones en Internet sobre la división de la estructura de archivos CSS, que generalmente son solo unos pocos archivos: layout.css/main.css/footer.css/header.css/reset.css, etc. Todo el mundo dice que son buenos en eso y deben practicarlo antes de implementarlos. Comprenda que no existe lo mejor, solo lo más adecuado. La mejor división de estilos debería depender estrechamente de la propia estructura HTML, en lugar de ser universal.
Además de facilitar la futura división del trabajo y la colaboración, la distribución de archivos CSS también tiene un punto muy importante: si los bytes son pequeños, se pueden comprimir tanto como sea posible para reducir el número de conexiones simultáneas. grandes, se pueden dividir para evitar que la velocidad de descarga sea demasiado lenta y afecte la carga del estilo. Se trata de cuestiones específicas que deben abordarse caso por caso. Por ejemplo, para páginas muy visitadas, como motores de búsqueda y páginas de inicio de portales, es mejor escribir CSS dentro de la página.
Decida preliminarmente la estructura del estilo CSS:
Código fuente de ejemplo
reset.css /*Recarga de estilo de página*/
header.css /*Estilo de encabezado para todo el sitio*/
footer.css /*Estilo de pie de página completo del sitio*/
public.css /*Estilo de módulo público para todo el sitio*/
index.css /*Estilo único de la página de inicio*/
container.css /*Estilos de cuerpo de nivel 2 e inferiores*/
print.css /*Estilo de impresión*/
es decir.css /*truco de IE*/
(3) División del trabajo y colaboración
El escenario ya está montado y comenzará el canto. Encuentre todas las listas de texto públicas y listas mixtas de imágenes y texto. Una persona se encarga de escribir en el módulo público, una persona para el principio y el final, y una persona para el marco de la página secundaria. La parte personalizada se deja para el final.
Todavía hay muchos problemas en la operación real. La redundancia de código no se puede evitar y solo se puede minimizar. A veces es necesario hacer sacrificios para ser eficiente. Lo anterior es sólo un poco de mi experiencia en el trabajo. También es la primera vez que exploramos realmente las ventajas de la modularidad de CSS: fácil de modificar, fácil de administrar y fácil para la colaboración entre varias personas. Espero poder discutirlo con los expertos.