PC端整页实战

教程来源-千峰ghost老师

PC端的布局

通栏 : 自适应浏览器的宽度。
版心 : 固定一个宽度，并且让容器居中。

1. PC端企业类型整页制作练习

github

总结：

1.观察网页布局

版心 通栏

2.创建html文件、通用css文件、图片文件夹

3.写通用css文件

（1）重置样式
（2）通栏基本样式/版心基本样式/浮动/去浮动

4.写网页结构(看总共几大块，分步完成)

5.写样式

先写选择器，简单的写完，复杂的后续再添加

注意：对于网页中某些通用的样式写在通用css文件内；算间距时注意行高和字体大小的换算；样式不起作用时注意检查优先级；

2. PC端游戏类型整页制作

总结：

• head_logo添加a链接，内容的腾讯游戏是为了搜索引擎优化SEO(利用text-indent首行缩进，然后溢出隐藏不显示)

• 代码美化

• 结构性伪类选择器
  nth-child、first-child、last-child

• 定位

• 雪碧图

• 图片叠加 ……

github

练习：把剩余的部分补上