学成在线案例练习

跟着视频学了一下午还有晚上的网页案例练习，太不容易了真的，分了好四个板块写了284行样式标签 总结一下学成在线的案例把，结合以前学的知识，明天再练习一遍

学成在线案例

案例准备工作

我们本次采取结构与样式相分离的思想

1.创建study目录文件夹(用于存放我们我们这个页面的相关内容)

2.用vscode打开这个目录文件夹

3.study目录内新建images文件夹，用于保存图片

4.新建首页文件index.html(以后我们的网站首页同意规定为index.html)

5.新建style.CSS样式文件，我们本次采用外链样式表

6.将样式引入到我们的HTML页面文件中

7.样式表写入清除内外边距的样式，来检测样式表是否引入成功

CSS属性书写顺序(重点)

1.布局定位属性 display position float

2.自身属性 width height padding margin

3.文本属性 color text-decoration

4.其他属性(CSS3) content /border-radius / test-shadow

页面布局整体思路

为了提高网页制作的效率，布局时通常有以下的整体思路：

1.必须确定页面的版心(可视区) 盒子的宽度 我们测量可得知

2.分析页面中的行模块，以及美观行模块中的列模块，其实页面布局第一准侧

3.一行中的列模块经常浮动布局，先确定每个列的大小，之后确定列的位置，页面布局第二准则

4.制作HTML结构 我们还是遵循 现有结构后有样式的原则 结构永远最重要

5.所以先理清楚 布局结