IE6,IE7margin导致下级div出错
<div class="speech" style=“width:100px;margin-left:10px;”> <textarea>我也要参与交流</textarea> </div>
在ie6,和IE7中,textarea左边也会继承10px 的margin值。
我解决的办法是margin改成padding就可以了。
或者是:
<div class="speech" style=“width:100px;margin-left:10px;”> <span><textarea>我也要参与交流</textarea></span> </div> 在外面加上span就可以了
在网上又找到这样的解释。
代码如下: <div id="div_1" style="margin-left:100px"> <div id="div_2" style="border:1px solid #000;width:100px"><input type="submit" value="button"/></div> </div> 在IE7下出错。我通过div_1是整个内容距离左边100px,结果导致了div_2中的内容又距离左边100px,实际的想过好像是div_1 margin-left:100px同时div_2 padding-left:100px。 如果把div_1的margin改为padding就正常了。 请问这样的问题如何解决 答案: 实际上在IE6已经有这个bug了,但是很不幸IE7继承了IE6的BUG多的优良传统。 就是说你的错误在IE6和IE7下都会产生。 产生这种错误的原因是因为当input仅仅包含父元素,父元素拥有layout,和margin-left属性时,IE6和7的input就会错误的继承margin-left这样的属性。 还是说解决办法吧。 网上总结了很多解决办法,为了不改变你原始父元素的样式定义,推荐的解决办法就是: 给input元素外面套一个span,label这样的内联元素,这样就会消除bug。 原理很简单,input父元素是内敛元素,就不会继承margin-left了。
IE6,7中,li里面的弹出层会被下面的li挡住的bug的解决
一般我们有一个列表,我们用
ul,li来实现,,,
然而,li里面有个<a href="#"><img src="a.jpg"/></a>,我们有一个这样的交互,鼠标放到li里面的a上有个弹出层来显示更详细的信息。
因为我们每个里面都有个这样的<a href="#"><img src="a.jpg"/></a>东西。如果说我们在css样式表中设置ul li{z-index:9;}以及弹出层的z-index:99;来提高弹出层的层级使其在最上面。
但是这个时候在IE6,7上有问题了,,,,
我们在第一个li上面的弹出层会被第二个li里面的img挡住。。。
很诡异,这个时候他们只认识,父级的z-index。。li的z-index是一样的,所以他们是平级的,li里面的弹出层不管他的z-index有多高都是li里面小于li的。,所以下面的li里面的img一定在上面。。。
为了处理这个bug我们必须在每个li里面设置他的z-index,从上面到下面依次要低。。。也就是最上面的li的z-index是最大的。。
这样就不会覆盖了。。。
很久以前用到的一种。。图片热点
还没有用到图片热点这个功能,
今天才听说,还挺好用的。适当的情况下用用减少很多时间
<body>
<img src="images/02.png" border="0" usemap="#Map" />
<map name="Map" id="Map">
<area shape="rect" coords="196,51,235,76" href="#" />
<area shape="rect" coords="442,122,554,151" href="#" />
<area shape="rect" coords="447,159,553,185" href="#" />
<area shape="rect" coords="438,290,556,321" href="#" />
</map>
</body>
我们在页面中载入图片之后,在拆分中,点击设计下面的图片
则DW 工具下面会有属性出来。
属性中有地图map,图像热点主要用的就是map属性
我们可以自动选取自己想要的图片中那些点也就是坐标的位置。
则页面中会生成map这一段。
这样我们就可以做链接或者点击某一点的一些动作
下面是js 的继承:
下面是查的,比较完整的,保存起来,,,
JavaScript中要实现继承,其实就是实现三层含义:
1、子类的实例可以共享父类的方法;
2、子类可以覆盖父类的方法或者扩展新的方法;
3、子类和父类都是子类实例的“类型”。
JavaScript中,并不直接从语法上支持继承,但是可以通过模拟的方法来实现继承,以下是关于实现继承的几种方法的总结:
1、构造继承法
2、原型继承法
3、实例继承法
4、拷贝继承法
1、构造继承法:
在子类中执行父类的构造函数。
<SCRIPT LANGUAGE="JavaScript"> 2 <!-- 3 function dwn(s) 4 { 5 document.write(s+'<br/>'); 6 } 7 8 //定义一个Collection类型 9 function Collection(size) 10 { 11 this.size = function(){return size}; //公有方法,可以被继承 12 } 13 14 //定义一个_Collection类型 15 function _Collection(_size) 16 { 17 this._size = function(){return _size}; //公有方法,可以被继承 18 } 19 20 Collection.prototype.isEmpty = function() //静态方法,不能被继承 21 { 22 return this.size() == 0; 23 } 24 25 //定义一个ArrayList类型,它“继承”Colleciton类型 26 function ArrayList() 27 { 28 var m_elements = []; //私有成员,不能被继承 29 m_elements = Array.apply(m_elements,arguments); 30 31 //ArrayList类型继承Colleciton 32 this.base = Collection; 33 this.base.call(this,m_elements.length); 34 35 this.base = _Collection; //可以实现多态继承 36 this.base.call(this,m_elements.length); 37 38 this.add = function() 39 { 40 return m_elements.push.apply(m_elements,arguments); 41 } 42 43 this.toArray = function() 44 { 45 return m_elements; 46 } 47 } 48 49 ArrayList.prototype.toString = function() 50 { 51 return this.toArray().toString(); 52 } 53 54 //定义一个SortedList类型,它继承ArrayList类型 55 function SortedList() 56 { 57 //SortedList类型继承ArrayList 58 this.base = ArrayList; 59 this.base.apply(this,arguments); 60 61 this.sort = function() 62 { 63 var arr = this.toArray(); 64 arr.sort.apply(arr,arguments); 65 } 66 } 67 68 //构造一个ArrayList 69 var a = new ArrayList(1,2,3); 70 dwn(a); //1,2,3 71 dwn(a.size()); //3 a从Collection继承了size()方法 72 dwn(a.isEmpty); //undefined 但是a没有继承到isEmpty()方法 73 74 dwn(a._size()); //3 可以实现多态继承 75 76 //构造一个SortedList 77 var b = new SortedList(3,1,2); 78 dwn(b.toArray()); 79 b.add(4,0); //b 从ArrayList继承了add()方法 80 dwn(b.toArray()); //b从ArrayList继承了toArray()方法 81 b.sort(); //b自己实现sort()方法 82 dwn(b.toArray()); 83 dwn(b); 84 dwn(b.size()); //b从Collection继承了size()方法 85 //--> 86 </SCRIPT>
2、原型继承法:
JavaScript是一种基于原型的语言。要了解什么是“原型继承法”,先了解一下prototype的特性:prototype的最大特性是能够让对象实例共享原型对象的属性,因此如果把某个对 象作为一个类型的原型,那么我们说这个类型的所有实例都一这个对象为原型。这个时候,实际上这个对象的类型也可以作为那些以这个对象为原型的实例的类型。
假如:Point类的对象作为Point2D类型的原型(Point2D.prototype = new Point(2)),那么说Point2D的所有实例都是以Point类的对象为原型。此时,实际上Point类就可以作为Point2D类型的对象的类 型(相当于Point2D类型“继承”了Point类型)。
见例: