您的位置:首页 > Web前端

前端的注意事项

2016-01-20 13:06 288 查看
1、尽量不要使用table

eg:如下的图片不适合用table做,原因是:

<TABLE><TR><TD></TD></TR></TABLE>这是构成一个表格的最基本元素,相对<DIV></DIV>编写来说,代码就会显得比较多一些因为后台代码多的缘故,因此会造成网页打开速度慢的情况!

速度和加载方式方面的区别(相对比较慢)

div 的加载方式是即读即加载,遇到 <div> 没有遇到 </div> 的时候一样加载 div 中的内容,读多少加载多少;table 的加载方式是完成后加载,遇到 <table> 后,在读到 </table> 之前,table 中的内容不加载,或者传输中断了(document.onload()事件)的时候加载,这是因为TABLE牵涉到多行多列问题,所以只有当TABLE所有内容加载完毕,IE才知道该怎么显示

table的可维护性比较差



2、<a href="#"></a> <a href="javascript:void(0)"></a>

"#"包含了一个位置信息默认的锚点是#top 也就是网页的上端

这是在页面无刷新的时候的方法

而javascript:void(0) 仅仅表示一个死链接这就是为什么有的时候页面很长浏览链接明明是#可是跳动到了页首

而javascript:void(0) 则不是如此所以调用脚本的时候最好用void(0)

这是在页面有刷新的时候的方法

<a href="#" onclick="javascript:方法;return false;">提交</a>

3、Img改为块级元素,以及劲量不要将图片设置为背景图



因为设置为背景图的大小和原图的大小不一致,以及后期的维护性比较差,以及这种banner形式的头部不需要定死这个高度,这样后期的维护性较好,坐下两排字可以根据顶部定位,这样可以定位没有那么容易乱

<div><img src="a.jpg" /></div>这种形式:

当一个div只有一张图片的时候,图片的大小为240px但是当你审查元素的时候你会发现这个div的高度变为了247,

因此当你只想你的div只有240px的时候,把图片设置为块级元素,那么div的高度就只有240px了

4、小图标是可以定死宽高的,以及可以用i标签<i class="icon"></i>

.icon{ background:url("/images/icon.jpg") no-repeat; }的形式显示出来

5、有部分内容如果div内容过长就用省略号显示

.ellipsis{text-overflow: ellipsis;white-space: nowrap;overflow:hidden; }white-space: nowrap;文本不换行

这个是要求div定了宽度,如果没定宽度的话div会不断变长,如果是绝对定位的前提下可以设置right:20px(eg:距离右边的距离,这样不会超出浏览器的距离)

6、window.onresize=function(){middle();}这样可以每次浏览器窗口变化的时候,函数每次都可以调用

但是这样window.onresize=middle()的时候就不行~

windowResize是一个函数名称,windowResize()是函数调用,或者是得到函数运行的结果。

window.onresize=function(){};事实是将函数赋值给onresize,而不是要得到函数运行的结果

解决方法:window。onresize=middle 不加括号
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: