不能用100%ie6不兼容
<!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>web浮动练习</title> <!-- 先写结构然后结构优化 然后写css样式 --> <style type="text/css">
body,div,#header,#content,#footer,ul,li,#box,#contentright,#contentleft{margin:0px; padding:0px;} /* 重置css标签*/
#header,#content,#footer,ul{width:800px; margin:0 auto; font-weight:bold; font-style:normal;}/* 集体声明 水平居中 字体加粗 字体样式 标准*/
#header{height: 80px;background:#85C8FA;}
#content{ background:#0F0; overflow:hidden;} /*解决溢出问题 */ /*去掉高度 内容在文本流之中缩小为0 overflow: hidden;解决问题 父级盒子高度自适应不要用清除浮动*/
#box{background:#ffc; width:100%; height:500px; float:left;}
#contentright{ margin-left:600px;background:#CCF; height:500px; width:200px; float:left; display:inline;} /*留出600px的边距*/
#contentleft{ background:#999; height:500px; width:600px; float:left;margin-left:-800px; display:inline;} /*去掉霸权主义 左边距负100 正好跨越一个页面 到最左边右边的留出一块相对距离正好组成一个页面*/ #footer{height:100px; background:#85C8FA;}
ul{background: #60F; height:40px; margin-bottom:1px #333; }
ul li { height:40px; line-height:40px; float:left; list-style:none;} /*设置高度 行高 使其垂直居中*/
ul li a{ color:#fff; padding:0 20px;text-decoration:none; float:left; display:block;} /*设置a的内边距撑大 a盒子让连接范围扩大到边距 去掉下划线 设置ie6 不识别块状元素bug*/
ul li a:hover{ background: #FE9827;} /*设置鼠标移动效果 背景颜色*/ </style>
</head> <body>
<div id="header">web布局练习</div>
<div id="nav"> <ul>
<li><a href="#">首页</a></li>
<li><a href="#">jquery</a></li>
<li><a href="#">Javascript</a></li>
<li><a href="#">xhtml</a></li>
<li><a href="#">css3</a></li>
<li><a href="#">html5</a></li>
<li><a href="#">关于作者</a></li>
</div>
<div id="content">
<div id="box">
<div id="contentright"></div>
</div>
<div id="contentleft"></div> </div>
<div id="footer">footer</div> </body>
</html>
不能用100%ie6不兼容的更多相关文章
- IE6部分兼容问题
border-style:dotted 点线 IE6不兼容 (除了solid以外,其它都有兼容问题,不完全一样) a IE6 不支持a以外的所有标签伪类,IE6以上版本支持所有标签的hover伪类. ...
- ie6的兼容总结
ie6的兼容处理总结 1.透明背景图: .timer { _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='my.png ...
- IE6浏览器兼容问题及部分解决方案(网上整理)
作为一个初涉前端技术的IT菜鸟,IE浏览器的兼容问题是一个不得不跨越的坎.为了能够在不同浏览器达到同样的显示效果,就不得不花心思想出办法实现兼容.由于各大主流浏览器内核不同,各自的实现标准有所差异,因 ...
- IE6不兼容问题
IE6不兼容问题 一.选择器兼容问题 1.交集选择器从IE7以上兼容(div.special): 2.儿子选择器(>):IE7开始兼容,IE6不兼容. 3.序选择器(first ...
- IE6支持兼容min-width、max-width CSS样式属性
IE6支持兼容min-width.max-width CSS样式属性 让IE6支持max-width.IE6支持min-width样式 我们在写CSS的时候,常常会遇到让一个图片或一个布局不能超出设定 ...
- IE6 的兼容相关问题
因为在实习公司要求兼容IE6+,所以将IE6相关的样式兼容问题列出,及解决方案. 1.让页面变丑的透明背景图片问题: HTML都为以下代码: <div class="img-png&q ...
- min-height最小高度的实现(兼容IE6、IE7、FF)(解决IE6不兼容min-height)
<!doctype html><html> <head> <meta charset="UTF-8"> <meta name= ...
- ie6下兼容问题
最小高度问题:overflow:hidden 在ie6.7下 li本身不浮动 内容浮动 li产生3像素间隙 解决:vertical-align:top; 二.当ie6下最小高度问题和li间隙问题共存时 ...
- ie6的兼容问题及解决方案
1.png24位的图片在ie6浏览器上会出现背景,解决方案是做成png8位: 2.浏览器默认的margin和padding不同,解决方法是用全局重置来统一,即是*{margin:0;padding:0 ...
随机推荐
- C# 前台线程和后台线程
进程会等待所有的前台线程完成后在结束工作,但是如果只剩下后台线程,则会直接结束工作 using System; using System.Collections.Generic; using Syst ...
- yarn.resourcemanager.ha.id设置
resourcemanager启动报错,其中一个启动成功,另一个启动报8088端口被成功启动的rm占用 2016-11-18 17:08:49,478 INFO org.apache.zookeepe ...
- VHDL MOD和REM(转)
mod(取模)and rem(取余) VHDL has mod and rem. They return the same value if both arguments are positive. ...
- js动态添加事件
转载的,但不明确出处 往往我们需要在 JS 中动态添加事件,这就涉及到浏览器兼容性问题了,以下谈及的几种方法,我们也常常混合使用.方法一.setAttributevar obj = document. ...
- hdu 1102 Constructing Roads Kruscal
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1102 题意:这道题实际上和hdu 1242 Rescue 非常相似,改变了输入方式之后, 本题实际上更 ...
- ZigBee HA示例程序分析
ZigBee协议栈中自带的HomeAutomation例程,虽然也是操作灯泡,但是,是通过ZCL来统一处理的,符合HA profile规范,互连互操作性较好.下面就简要分析以下ZCL的使用. 在任务数 ...
- POJ 3624
背包问题,在定容量的背包中放入物体求装满价值最大.因为每种物体数量只有1,故只有放与不放. #include<iostream> #include<cstring> #incl ...
- 汇编语言-求X的阶乘
1. 题目:求X的阶乘值 2. 要求:输入一个整型数(不超过10),求出其阶乘值后输出,求阶乘的算法用子程序来实现. 3. 提示:可以用递归来实现,也可以用简单的循环来实现. 这里使用循环来实现: 对 ...
- Javascript this 解析
Javascript中,this是一个非常有用的关键字, this是在运行时基于函数的运行环境绑定的,但是,如果使用的时候不注意,很容易就出错了. ECMAScript Standard对this的定 ...
- 【转】JavaScript里的this指针
用自然语言的角度理解JavaScript中的this关键字 <script type="text/javascript"> function ftn03(){ var ...