使用Bootstrap创建静态介绍古典art和music的网页（学习笔记1）

本文链接：https://blog.youkuaiyun.com/m0_50854494/article/details/123032767

项目背景、技术栈

这是一个普及Classical art的英文网页它包括html主文件和CSS,imagines,js,video等文件，通过Vs code自带的库，导入合适的CSS等资源，建立了完善的英文网页。它拥有导航、各种形式的表格、多样化的插件及功能，静态网页元素（容器网格系统文字排版颜色表格图像形状 Jumbotron 信息提示框按钮按钮组分页列表组）

项目介绍

这个项目我们是用bootstrap4创建了一个静态的，暂时无法轻易变化的网页。网站的主题是介绍古典艺术，包括古典绘画和音乐。

网页最基本的模板参考了很多不同的网页，至于内容组件主要是从菜鸟教程里面学的，它拥有导航、各种形式的表格、多样化的插件及功能，静态网页元素（容器网格系统文字排版颜色表格图像形状 Jumbotron 信息提示框按钮按钮组分页列表组）

实现以上功能，基本上不需要js来创造一些额外的function，所以主要参考的是老师给的一个模板，它包含了CSS，JS， Images and video等比较完善的文件包。因为这个网页太简陋，所以我去找了另一个网页模板，文件的头部head处引用了他的css样式表。

项目难点

这个项目难度主要有两处，第1处主要是，两种css同时存在在这个网页中，原因是一部分的，css是直接在html中定义的，本来在原来的模板中并不显得特别，但我更换上另一个网页的css，之后就很违和了，我一直从css中文件找问题，但后来，过了很久才发现是内部的问题。

第2处主要是，div的结构过于复杂，有一处结构非常特别的错误，导致不管怎么改好像都并没有用处，或者改的话，并不能有好的效果，我把结构重新看了一遍，才发现了问题，后来我就很重视他的那个结构，空4格空几格的那种。从这个时候我就感觉前端工程化是一个比较重要的概念，前端工程化就是为了让前端开发能够“自成体系”，它主要应该从模块化、组件化、规范化、自动化四个方面思考，我觉得他的规范化是最重要的一种。