前端工作注意事项(PC端)

1.H5文档link,script不需要加type属性
2.低版本浏览器兼容问题:
(1)PC端 H5新标签尽量不用,不如header,footer,nav,采用加类名;
(2)CSS选择器 nth-of-type不使用,改为加类名;
3.标签语义化,P标签,span,strong,H标签要使用合理;
4.html模块化;
6.内容超出,以省略号显示;
7.a链接嵌套要合适,避免行元素包含块元素;
8.浮动之后要清浮动;
9.子元素共有的属性,可以直接设置父级就行;
10.分为内外屏,采取加CLASS名,.ww .w 内屏有最大宽度;
11.可以通过同时写上并列的两个class名,精准控制CSS样式;
12.使用<label>标签包裹radio或checkbox和他们的文字,不用再使用for属性;
13.有效使用<thead>、<tfoot>、<tbody>、<th>(scope属性)。可以把<tfoot>放<tbody>前提高加载速度。
14.特殊符号尽可能使用代码替代。常用特殊符号如下。
¥:&yen; 人民币符号元
©:&copy; 版权
®: &reg; 注册商标
™: &trade; 商标TM
·: &middot; 间隔符号
“: &quot; 双引号
&: &amp; &符
<: &lt; 小于号
>: &gt; 大于号
: &nbsp; 半角空格
×:&times; 乘号
÷: &divide; 除号
15.为选择器中的属性添加单引号。eg:input[type='text']。
16.为引用的图片、文件等添加单引号。eg:background:url('../images/logo.png');
17.css hack
    IE6:_
    IE6/7: *
    IE7/Firefox:!important
    IE7:*+
    IE6/7/8:\9
    IE8:\0
18.尽量将图片大小控制在200K以内,可以使用一些在线的图片压缩工具。如:图好快;
19.标题 用图片的 将文字写在alt属性里面;
20.链接要有明显的样式;
21.按钮添加交互效果;
22.图片太大,设置图片的最大值max-width,防止超出变形;
23.JS统一写在 $(document).ready(function(){ }); 里面
24.设置的行高 要大于字体大小;
25.所有的图片 加上 alt属性;
26.js代码 后面都需要加上 “;”号;
27.背景图过大,可以选择切一部分然后平铺;
28. h*标签下面 如果用图片的话 alt属性要写;
29.定位z-index数值不能超过最外层的弹窗;
30.用绝对定位的时候,top,left值必须写;
31.用a标签包裹块元素时,给a加上属性 display:block;

posted @ 2017-02-25 17:30  强哥遛遛弯儿  阅读(1287)  评论(0编辑  收藏  举报