您的位置：首页 > Web前端

web前端学习笔记1

2010-08-03 20:30 661 查看

1.ie 和 ff 文字居中不一致问题。解决方法：把text-align:center 去掉。

2.背景图片比div宽度大导致出现间隙。解决方法：把div宽度设置得比图片小一些。

3.j如果函数无明确的返回值，或调用了没有参数的return 语句，那么它真正返回的值是undefined.

4.尽管可用Function构造函数创建函数，但最好不要用它，因为用它定义函数比用传统方法要慢。所有函数都应看作是Function类的实例。

5.写样式之前一定要充分考虑到文档结构的合理性，良好的结构可以节省很多写样式的时间。

6.发现样式实现有困难应停下来检查结构的实现有没有更好的布局。

7.记得要清理浮动元素。两种清理浮动的方法如下

1.FF

.goods_list :after 　/* clear the float of ul(goods_list) for non-IE browsers */
{
content:"";
height:0;
display:block;
}

2.IE

.goods_list
{
*zoom:1;
height:90px;
background:#ffffff;
/* the three items followed is for ie6's float bug */
width:86%;
padding-right:5px;
float:left;
}

8.IE6 浮动BUG

蓝色经典上的问题及解决方法

http://bbs.blueidea.com/thread-2969970-1-1.html

解决方法

<!doctype html>
<html>
<head>
<meta charset="gbk" />
<title>Sample page</title>
<link rel="stylesheet" href="css_example_url" mce_href="css_example_url" />
<mce:style><!--
* {margin: 0; padding: 0;}
.a
{
background:red;
float:left;
width:103px ;
height:90px;
}
.b
{
height:90px;
background:blue;
float:left;
}
.clear{
clear:both;
}
--></mce:style><style mce_bogus="1">* {margin: 0; padding: 0;}
.a
{
background:red;
float:left;
width:103px ;
height:90px;
}
.b
{
height:90px;
background:blue;
float:left;
}
.clear{
clear:both;
}</style>
</head>
<body>
<div class="wrap">
<div class="a" >
aaa aaa aaa aaa aaa
</div>
<ul class="b">
bbbbbbbbbbbbbb
</ul>
<div class="clear">
</div>
</div>
</body>
</html>

9.YUI 为元素注册事件方法

/* Returns an array of HTMLElements with the given class. For optimized performance, include a tag and/or root node when possible. Note: This method operates against a live collection, so modifying the collection in the callback (removing/appending nodes, etc.) will have side effects. Instead you should iterate the returned nodes array, as you would with the native "getElementsByTagName" method.
Parameters:
className <String> The class name to match against
tag <String> (optional) The tag name of the elements being collected
root <String | HTMLElement> (optional) The HTMLElement or an ID to use as the starting point. This element is not included in the className scan.
apply <Function> (optional) A function to apply to each element when found
o <Any> (optional) An optional arg that is passed to the supplied method
overrides <Boolean> (optional) Whether or not to override the scope of "method" with "o"
Returns: Array
An array of elements that have the given class name
eg.
(function (){
function emulate_hover(item)
{
YAHOO.util.Event.on(item,'mouseover',function(){YAHOO.util.Dom.addClass(this,'hover')});
YAHOO.util.Event.on(item,'mouseout',function(){YAHOO.util.Dom.removeClass(this,'hover')})
}
YAHOO.util.Dom.getElementsByClassName("one_category",'div','selected_brands',emulate_hover);//为'selected_brands下所有具有one_category类的div元素注册监听事件
})();

9.合并所有具有相同属性的类

10.将背景图片写在一处地方

11.布局的背景图片尽量采用sprites技术来减少 http请求

12.交流问题可以提高效率 ,寻找师兄帮助

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航