Akiiiira的博客

项目名称：品优购项目描述：品优购是一个电商网站，我们要完成 PC 端首页、列表页、注册页面的制作我们写的品优购网站，目前是放到自己电脑上的，只能自己访问浏览。如果想要很多人访问我们的网站，可以把品优购放到服务器上，这样就可以多人访问我们的品优购网站了。服务器（我们也会称之为主机）是提供计算服务的设备，它也是一台计算机。在网络环境下，根据服务器提供的服务类型不同，服务器又分为文件服务器、数据库服务器、应用程序服务器、Web 服务器等。Web 服务器一般指网站服务器。

转换transform 我们简单理解就是变形 有2D 和 3D 之分我们暂且学了三个 分别是 位移 旋转 和 缩放2D 移动 translate(x, y) 最大的优势是不影响其他盒子， 里面参数用%，是相对于自身宽度和高度来计算的可以分开写比如 translateX(x) 和 translateY(y)2D 旋转 rotate(度数) 可以实现旋转元素 度数的单位是deg2D 缩放 sacle(x,y) 里面参数是数字 不跟单位可以是小数 最大的优势 不影响其他盒子。

过渡（transition)是CSS3中具有颠覆性的特征之一，我们可以在不使用 Flash 动画或 JavaScript 的情况下，当元素从一种样式变换为另一种样式时为元素添加效果。HTML5 在不使用插件的情况下，也可以原生的支持视频格式文件的播放，当然，支持的格式是有限的。对于红色，是因为先找到的光头强，其标签为 p，与声明的 div 不符合，即没有符合条件的，所以不会变红。HTML5 在不使用插件的情况下，也可以原生的支持音频格式文件的播放，当然，支持的格式是有限的。

这是因为在渲染过程中，是先读取网页结构，再按照样式一个接一个的渲染，第二个盒子的初始位置一定是紧贴第一个盒子的，所以不存在抵消情况。一个网页中往往会应用很多小的背景图像作为修饰，当网页中的图像过多时，服务器就会频繁地接收和发送请求图片，造成服务器请求压力过大，这将大大降低页面的加载速度。不同浏览器对有些标签的默认值是不同的，为了消除不同浏览器对HTML文本呈现的差异，照顾浏览器的兼容，我们需要对CSS 初始化。如果工作中，原来的字体图标不够用了，我们需要添加新的字体图标到原来的字体文件中。

一定记住 相对定位、固定定位、绝对定位 两个大的特点： 1. 是否占有位置（脱标否） 2. 以谁为基准点移动位置。学习定位重点学会子绝父相。通过盒子模型，清楚知道大部分html标签是一个盒子。通过CSS浮动、定位 可以让每个盒子排列成为网页。一个完整的网页，是标准流、浮动、定位一起完成布局的，每个都有自己的专门用法。1. 标准流可以让盒子上下排列或者左右排列，垂直的块级盒子显示就用标准流布局。2. 浮动可以让多个块级元素一行显示或者左右对齐盒子，

核心部分采用 10 个 li 即可，要记得对每个 li 的浮动，右边距声明即可。如果直接建立一个 footer 盒子，刷新后会发现直接与上面的核心模块重叠了，这是因为 li 没有声明高度，这个父盒子的高度就变成了 0（详细参考上一篇 “浮动” 文章中的讲解）。复习点：我们用到清除浮动，因为 box-hd 里面的盒子个数不一定是多少，所以我们就不给高度了，但是里面的盒子浮动会影响下面的布局，因此需要清除浮动。其中，观察到 “首页” 下面有条横线，这是典型的鼠标经过的标签，所以添加关于 hover 的声明。

float属性用于创建浮动框，将其移动到一边，直到左边缘或右边缘触及包含块或另一个浮动框的边缘。选择器 { float: 属性值;为什么需要清除浮动？父级没高度。子盒子浮动了。影响下面布局了，我们就应该清除浮动了。

1. 布局为啥用不同盒子,我只想用div？标签都是有语义的, 合理的地方用合理的标签。比如产品标题 就用 h, 大量文字段落就用p2. 为啥用辣么多类名？类名就是给每个盒子起了一个名字,可以更好的找到这个盒子, 选取盒子更容易,后期维护也方便。3. 到底用 margin 还是 padding？大部分情况两个可以混用，两者各有优缺点，但是根据实际情况，总是有更简单的方法实现。4. 自己做没有思路？布局有很多种实现方式，同学们可以开始先模仿老师的写法，然后再做出自己的风格。

在 CSS 中，可以根据选择器的类型把选择器分为基础选择器和复合选择器，复合选择器是建立在基础选择器之上，对基本选择器进行组合形成的。复合选择器可以更准确、更高效的选择目标元素（标签）复合选择器是由两个或多个基础选择器，通过不同的方式组合而成的常用的复合选择器包括：后代选择器、子选择器、并集选择器、伪类选择器等等作用：网页的标签非常多，在不同地方会用到不同类型的标签，了解他们的特点可以更好的布局我们的网页。元素显示模式就是元素（标签）以什么方式进行显示。

CSS 的主要使用场景就是美化网页,布局页面的.每个基础选择器都有使用场景，都需要掌握如果是修改样式， 类选择器是使用最多的字体复合属性如何写?里面有什么注意细节?如果让加粗的文字不加粗显示, 如何让倾斜的文字不倾斜显示?行内样式表（行内式）内部样式表（嵌入式）外部样式表（链接式）案例：新闻页面搭建html结构页面.修改CSS样式这里建议多去回顾几次，学习学习 CSS 的编写思路demo参考代码body {h1 {/* 文字不加粗 */

标签用于定义描述列表（或定义列表），该标签会与（定义项目/名字）和（描述每一个项目/名字）一起使用。名词1名词1解释1名词1解释2

HTML标签通常是成对出现的,例如和

网站是指在因特网上根据一定的规则，使用 HTML等制作的用于展示特定内容相关的网页集合网页是网站中的一“页”，通常是HTML格式的文件，它要通过浏览器来阅读。网页是构成网站的基本元素,它通常由图片、链接、文字、声音、视频等元素组成。通常我们看到的网页常见以.htm或.html后缀结尾的文件，因此将其俗称为 HTML文件。HTML指的是超文本标记语言(HyperText Markup Language)，它是用来描述网页的一种语言。

学习 CSS3 基础，主要学习最常用没有兼容性的 CSS 样式，利用前面学习的标签完成传统 PC 端网页布局。教材：《Adobe创意大学 Dreamweaver CS6标准教材》《网页设计与制作》综合前面的知识点，贴近于实际开发，制作品优购电商网站，完成首页、列表页、注册页制作。学习 HTML5 新增的标签、CSS3 样式。有一定兼容性，可以与未来更好的接轨。学习 HTML5 基础，主要学习最常见的没有兼容性的 HTML 标签。目的：学习网页制作实际开发制作流程规范。综合案例：传统企业网页制作。