引言
-基于Boostrap进行网页设计
环境
用vs code进行编辑html文件
具体过程
实验题目 2.1：
1.首先新建文本文档，将后缀名改为.html
a.
2.用vs code打开此文件，进行编辑
3.在<head>中加入
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.1.0/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/popper.js/1.12.5/umd/popper.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/4.1.0/js/bootstrap.min.js"></script>
引用boostrap
4.分析主页的布局，主要分为三部分，用三个div来分组big、mainContainer、footer
5.在big中先引入图片backg.png，在big中再分2个div来编辑页面切换的超链接和在线人数的查看
6.主要的manContainer中分四部分，3-5-4-12，前三个div并列依次设置课程、新闻、项目以及文章。
1557733495(1).jpg
b.1557733592(1).jpg
c.1557733658(1).jpg
d.1557733734(1).jpg
7.footer为页脚的一张图片，插入方法如页头图片的插入
8.样式：1557733805(1).jpg
总结
- 初步掌握boostrap对网页设计的基本动作
- 代码过程中格式清晰有助于整理逻辑结构
