19.为什么这个背景颜色无法显示
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”> <meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ /> <style type=”text/css”> <!– ul { background:red } li { float:left; width:180px; } –> </style> <ul> <li>web标准常见问题大全</li> <li>web标准常见问题大全</li> <li>web标准常见问题大全</li> <li>web标准常见问题大全</li> <li>web标准常见问题大全</li> <div style=”clear:both”></div> </ul>
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
IE中设置有背景色的ul并没有显示出来,这个属于haslayout问题,解决的办法也很多参考:http://bbs.blueidea.com/viewthread.php?tid=2636904
20.怎么样才能让层显示在FLASH之上呢
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”> <meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ /> <style type=”text/css”> <!– div { position:absolute; top:20px; left:20px; width:200px; height:200px; background:red } object { width:500px; height:100px; } –> </style> <div> web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全 </div> <object type=”application/x-shockwave-flash” data=”http://gg.blueidea.com/2005/www/m533-104.swf”> <param name=”movie” value=”http://gg.blueidea.com/2005/www/m533-104.swf” /> </object>
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
解决的办法是给FLASH设置透明<param name=”wmode” value=”transparent” />
21.怎样使一个层垂直居中于浏览器中
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”> <meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ /> <style type=”text/css”> <!– div { position:absolute; top:50%; left:50%; margin:-100px 0 0 -100px; width:200px; height:200px; border:1px solid red; } –> </style> <div>web标准常见问题大全</div>
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
这里我们使用百分比绝对定位,与外补丁负值的方法,负值的大小为其自身宽度高度除以二
22 .图片垂直与容器内
复制代码 代码如下:
参考:http://bbs.blueidea.com/thread-2666987-1-1.html
23.如何让三列横向排列
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”> <style> div { float:left; margin:1px; width:200px; height:200px; background:orange } </style> <div></div> <div></div> <div></div>
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”> <style> div { position:absolute; top:50%; left:50%; margin:-100px 0 0 -300px; } </style> <div style=”background:#404040;width:200px;height:200px;”>1</div> <div style=”background:#FD7C03;width:200px;height:200px;margin:-100px 0 0 -100px;”>2</div> <div style=”background:#eee;width:200px;height:200px;margin:-100px 0 0 100px;”>3</div>
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”> <style> span { margin:1px; display:-moz-inline-box; display:inline-block; width:300px; height:200px; background:orange; } </style><span></span> <span></span> <span></span>
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
横向排列DIV可以使用浮动的方式比如float:left,或者用内联方式,还可以绝对定位对象等等.