[url=http://www.leutao.com/][img]http://www.leutao.com/templates/default/style/logo.png[/img][/url]
1、超链接访问过后hover样式就不出现的问题
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
a:link {
color:red;
}
a:hover {
color:blue;
}
a:visited {
color:green;
}
a:active {
colorrange;
}
</style>
</head>
<body>
<a href="#" mce_href="#">
web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全
</a>
</body>
</html>
解决方案：被点击访问过的超链接样式不在具有hover和active了，很多人应该都遇到过这个问题，解决方法是改变CSS属性的排列顺序：L-V-H-A
2、IE6的双倍边距BUG
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
body {
margin:0
}
div {
float:left;
margin-left:10px;
width:200px;
height:200px;
border:1px solid red
}
</style>
</head>
<body>
<div>
<a href="#" mce_href="#">web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全</a>
</div>
</body>
</html>
解决方案：浮动后本来外边距10px，但IE解释为20px，解决办法是加上display:inline
3、FF下为什么父容器的高度不能自适应
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
div {
width:200px;
border:1px solid red
}
p {
float:left;
width:100px;
}
</style>
</head>
<body>
<div><p>web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全</p></div>
</body>
</html>
解决方案一：为什么这个P撑不开DIV呢？解决的办法是在div与p之间插入<div style="clear:both"></div>清除掉这个p的浮动
解决方案二：不用插入<div style="clear:both"></div>，只要去掉P的浮动属性，把float:left;去掉即可
4、IE下为什么图片下方有空隙产生
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
div {
border:1px solid red;
backgroundrange;
}
img {
width:276px;
height:110px;
}
</style>
</head>
<body>
<div>
<img src="http://www.google.com/intl/en_ALL/images/logo.gif" alt="google" />
</div>
</body>
</html>
解决方案：这个IE的3PX BUG也是经常出现的，解决的办法是给.right也同样浮动float:left或者相对IE6定义.left margin-right:-3px;
5、web标准中定义id与class有什么区别吗
解决方案：
一、web标准中是不容许重复ID的，比如div id="aa"一个页面中不容许重复2次，而class定义的是类，理论上可以无限重复的，这样需要多次引用的定义便可以使用他.class还可以同时引用多个类，不同的类之间用空格隔开
二、属性的优先级问题，ID的优先级要高于class，看上面的例子
三、方便JS等客户端脚本，如果在页面中要对某个对象进行脚本操作，那么可以给他定义一个ID，否则只能利用遍历页面元素加上指定特定属性来找到它，这是相对浪费时间资源，远远不如一个ID来得简单
6、如何垂直居中文本
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
div {
height:30px;
line-height:30px;
border:1px solid red
}
</style>
</head>
<body>
<div>web标准常见问题大全</div>
</body>
</html>
解决方案：给容器设置一个与其高度相同的行高就可以了
7、如何对齐文本与文本输入框
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
input {
width:200px;
height:30px;
border:1px solid red;
}
</style>
</head>
<body>
<input type="text" />aaaaaaaaaaaaaaaaaa
</body>
</html>
解决方案：遇到此种问题，设置文本框的vertical-align:middle就可以了
8、为什么FF下文本无法撑开容器的高度
[code]<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
div {
width:200px;
height:200px;
border:1px solid red
}
</style>
</head>
<body>
<div>web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见</div>
</body>
</html>
解决方案：标准浏览器中固定高度值的容器是不会象IE6里那样被撑开的，那我又想固定高度，又想能被撑开需要怎样设置呢？办法就是去掉height设置min-height:200px;，这里为了照顾不认识min-height的IE6可以这样定义：
{
height:auto!important;
height:200px;
min-height:200px;
}
9、为什么无法定义1px左右高度的容器
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
div {
background:red;
}
</style>
</head>
<body>
<div> </div>
</body>
</html>
解决方案：IE6下这个问题是因为默认的行高造成的，解决的方法也有很多，例如overflow:hidden|zoom:0.08|line-height:1px
overflow:hidden：这个方法对所有的浏览器都没用
zoom:0.08：这个方法对FF没用
line-height:1px：这个方法对所有浏览器都有用
10、怎么样才能让层显示在FLASH之上呢
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
div {
position:absolute;
top:20px;
left:20px;
width:200px;
height:200px;
background:red
}
object {
width:500px;
height:100px;
}
</style>
</head>
<body>
<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>
</body>
</html>
解决方案：解决的办法是给FLASH设置透明<param name="wmode" value="transparent" />或者<param name="wmode" value="opaque" />
1、超链接访问过后hover样式就不出现的问题
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
a:link {
color:red;
}
a:hover {
color:blue;
}
a:visited {
color:green;
}
a:active {
colorrange;
}
</style>
</head>
<body>
<a href="#" mce_href="#">
web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全
</a>
</body>
</html>
解决方案：被点击访问过的超链接样式不在具有hover和active了，很多人应该都遇到过这个问题，解决方法是改变CSS属性的排列顺序：L-V-H-A
2、IE6的双倍边距BUG
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
body {
margin:0
}
div {
float:left;
margin-left:10px;
width:200px;
height:200px;
border:1px solid red
}
</style>
</head>
<body>
<div>
<a href="#" mce_href="#">web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全</a>
</div>
</body>
</html>
解决方案：浮动后本来外边距10px，但IE解释为20px，解决办法是加上display:inline
3、FF下为什么父容器的高度不能自适应
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
div {
width:200px;
border:1px solid red
}
p {
float:left;
width:100px;
}
</style>
</head>
<body>
<div><p>web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全</p></div>
</body>
</html>
解决方案一：为什么这个P撑不开DIV呢？解决的办法是在div与p之间插入<div style="clear:both"></div>清除掉这个p的浮动
解决方案二：不用插入<div style="clear:both"></div>，只要去掉P的浮动属性，把float:left;去掉即可
4、IE下为什么图片下方有空隙产生
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
div {
border:1px solid red;
backgroundrange;
}
img {
width:276px;
height:110px;
}
</style>
</head>
<body>
<div>
<img src="http://www.google.com/intl/en_ALL/images/logo.gif" alt="google" />
</div>
</body>
</html>
解决方案：这个IE的3PX BUG也是经常出现的，解决的办法是给.right也同样浮动float:left或者相对IE6定义.left margin-right:-3px;
5、web标准中定义id与class有什么区别吗
解决方案：
一、web标准中是不容许重复ID的，比如div id="aa"一个页面中不容许重复2次，而class定义的是类，理论上可以无限重复的，这样需要多次引用的定义便可以使用他.class还可以同时引用多个类，不同的类之间用空格隔开
二、属性的优先级问题，ID的优先级要高于class，看上面的例子
三、方便JS等客户端脚本，如果在页面中要对某个对象进行脚本操作，那么可以给他定义一个ID，否则只能利用遍历页面元素加上指定特定属性来找到它，这是相对浪费时间资源，远远不如一个ID来得简单
6、如何垂直居中文本
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
div {
height:30px;
line-height:30px;
border:1px solid red
}
</style>
</head>
<body>
<div>web标准常见问题大全</div>
</body>
</html>
解决方案：给容器设置一个与其高度相同的行高就可以了
7、如何对齐文本与文本输入框
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
input {
width:200px;
height:30px;
border:1px solid red;
}
</style>
</head>
<body>
<input type="text" />aaaaaaaaaaaaaaaaaa
</body>
</html>
解决方案：遇到此种问题，设置文本框的vertical-align:middle就可以了
8、为什么FF下文本无法撑开容器的高度
[code]<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
div {
width:200px;
height:200px;
border:1px solid red
}
</style>
</head>
<body>
<div>web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见</div>
</body>
</html>
解决方案：标准浏览器中固定高度值的容器是不会象IE6里那样被撑开的，那我又想固定高度，又想能被撑开需要怎样设置呢？办法就是去掉height设置min-height:200px;，这里为了照顾不认识min-height的IE6可以这样定义：
{
height:auto!important;
height:200px;
min-height:200px;
}
9、为什么无法定义1px左右高度的容器
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
div {
background:red;
}
</style>
</head>
<body>
<div> </div>
</body>
</html>
解决方案：IE6下这个问题是因为默认的行高造成的，解决的方法也有很多，例如overflow:hidden|zoom:0.08|line-height:1px
overflow:hidden：这个方法对所有的浏览器都没用
zoom:0.08：这个方法对FF没用
line-height:1px：这个方法对所有浏览器都有用
10、怎么样才能让层显示在FLASH之上呢
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
div {
position:absolute;
top:20px;
left:20px;
width:200px;
height:200px;
background:red
}
object {
width:500px;
height:100px;
}
</style>
</head>
<body>
<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>
</body>
</html>
解决方案：解决的办法是给FLASH设置透明<param name="wmode" value="transparent" />或者<param name="wmode" value="opaque" />
扫一扫
624
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
