css div 鼠标经过时图片变大
<style>
#enlarge {padding:0; margin:2em auto; list-style-type:none; width:240px;
height:40px;}
#enlarge li {display:block; float:left; width:40px; height:40px;
position:relative;}
#enlarge li a {display:block; width:40px; height:40px; background:transparent;
overflow:hidden; position:relative;}
#enlarge li a img {width:100%; height:100%; border:0;}
#enlarge li a:hover {position:absolute; left:-20px; top:-20px; width:80px;
height:80px; z-index:100;}
#div1 .div2
{
float:left; width:40px; height:40px; position:relative;
}
#div1 .div2 a {display:block; width:40px; height:40px; background:transparent;
overflow:hidden; position:relative;}
#div1 .div2 a img {width:100%; height:100%; border:0;}
#div1 .div2 a:hover {position:absolute; left:-20px; top:-20px; width:80px;
height:80px; z-index:100;}
</style>
<ul id="enlarge">
<li><a href="#one"><img src="http://www.dzwindows.com/images12_13/logo.png" alt="image 1"
title="image 1" />Image 1</a></li>
</ul>
<div id="div1">
<div class="div2">
<a href="#">
<img src="http://www.dzwindows.com/images12_13/logo.png" alt="image 1"
title="image 1" />
</a>
</div>
</div>
相关文档:
效果如下:
实现方法:利用一下两张图片:
前台代码:
<div id="nagivation">
&nb ......
宽度自适应的div+css的BOX
参考:
http://space.cnblogs.com/group/topic/3617/
http://www.dynamicdrive.com/style/layouts/item/css-left-and-right-frames-layout/ 一、效果: 二、素材: 三、代码: <style type="text/css">
.box{}
.box .box_tit{position:rela ......
DOCTYPE 影响 CSS 处理
Firefox: div 设置 margin-left, margin-right 为 auto 时已经居中, IE 不行
Firefox: body 设置 text-align 时, div 需要设置 margin: auto(主要是 margin-left,margin-right) 方可居中
Firefox: 设置 padding 后, div 会增加 height 和 width, 但 IE 不会, 故需要用 !important 多设一个 heig ......
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>TAO BAO TEST 2&l ......
1.document.formName.item("itemName") 问题
说明:IE下,可以使用document.formName.item("itemName")或document.formName.elements["elementName"];Firefox下,只能使用document.formName.elements["elementName"].
解决方法:统一使用document.formName.elements["elementName"].
2.集合类对象问题
说明:IE下,可以使用() ......