2018-03-12某证券招聘网站项目收获总结

pc端网页适配手机：

设置body的min-width:1200px;
同时设置meta标签控制缩放比例为1，最大和最小缩放比例为1，用户可以缩放

---

网页中的大块banner图片：

可以用背景做也可以用img标签做
背景的优势：可以控制图片的高度
背景的劣势：在不同尺寸的屏幕中可能出现显示不完全的现象。
img的优势：在不同尺寸的屏幕中，图片都可以完全显示，只需要将图片的宽度设置为100%就可以了

---

img标签默认有间距，需要设置为display：inline-block;

---

background设置图片位置的两个参数：前一个用于控制水平方向，后一个用于控制垂直方向，不能弄反

---

导航栏的每一项之间如果存在间距不能单纯的只是给一个面设置margin或者padding，这样会导致布局不对称。

---

页面元素的嵌套规范：一般都是块级元素包含内联元素，虽然反过来效果上没什么不同，但是不符合规范。

---

元素宽高属性的设定：一般都是由内层元素将外层元素撑开，而不用单独设置外层元素的宽高。
块级元素一般不用设置宽度属性，因为默认就是100%的。

---

css reset代码：

---

网页结构：

---

网页代码的复用：

建立在多个页面结构和功能相似的基础上，为每个页面的body设置一个id用于区分不同的页面。剩下的选择器最好都用class，至于不同页面中的差异可以通过对应的id选择器进行覆盖
js中改变样式，应该通过增加和移除类的方式，而不应该只是针对某一个元素的样式进行修改。

---

对已有插件样式的修改：根据状态改变找到对应的类所在的文件，进行修改。

---

已有轮播插件可能存在一个问题：整个插件的高度是由内部img元素撑起来的，这就导致了在元素没有加载完成时，整个插件高度为零，所以可以给其设置一个高度。

---

ps切图要精确

除主要内容外不能将布局切进去，那样是不规范的，如果以后布局发生微小变动不容易修改。

---

一定要让页面的每一个组件是一个整体

不能为了达到效果随意将一个背景添加到导航条后面的元素上。

---

使用jquery时，注意使用链式保证代码的简洁。

---

网页安全区

每一张网页设计稿都会有980px的安全显示区域，在布局时要注意网页在不同分辨率的电脑上是否会错位。最好在安全区内布局。拿来一个设计稿，首先想到的因该是怎么围绕着安全宽度980进行布局

---

::after ,::before伪类的使用

在文字前后有图标的时候可以使用（而不是和文字编辑在同一行中）。