4、去掉连接虚线框

当你点击链接时，Firefox会在链接周围产生一个虚线外框。

这个很好解决，只需在a标签中添加outline:none就可以了。

a{
   outline:none;
}

5、对inline元素应用宽度。

如果你对一个inline元素使用宽度，它将只在IE6下起作用。

所以的HTML标签要么是Block的要么就是inline的。inline属性的标签有<span><a><strong>和<em>Block标签包括<div><p><h1><form>和<li>

你不能控制inilne标签的宽带，不过有一个方法是把标签属性从inline改为Block。

span{
   width:150px;
   display:block;
}

应用display:block能够把span标签变成block标签，从而控制它的宽度。

6、使一个固定宽度的网站居中。

为了让你的网站在浏览器中居中，可以为最外层Div添加position:relative属性，然后将margin设为auto。

#wrapper {
margin: auto;
position: relative;
}

7、图片替换技术

对于头部来说，永远是最好用文字而不是图片。在你必须要用图片的某个特殊地方最好使用隐藏文字的层的背景图片。这对于屏幕阅读和SEO非常有用，尽管依然使用很普通的文字，这可以联想到所有的优点。

HTML：

<h1><span>Main heading one</span></h1>

CSS:

h1 {
background: url(heading-image.gif) no-repeat;
}
h1 span {
position:absolute;
text-indent: -5000px;
}

正如你所见，我们对H1标签使用普通的HTML代码，用CSS来将图片替代文字。Text-indent把文字放到左边5000像素处，从而用户看不到它们。

出处：蓝色理想
责任编辑：moby

上一页 CSS hacks与争议 [1] 下一页 CSS hacks与争议 [3]

◎进入论坛网页制作、WEB标准化版块参加讨论，我还想发表评论。