首页  韩国资源  酷站加油  我的展厅  设计名站  古典元素  推荐下载  设计欣赏  每周专访  招募精英  人才专区  网页教程  平面设计  编程开发  设计竞赛
当前位置:首页 > 网页教程 > HTMLCSS教程 > 正文
Google
CSS hacks与争议
来源:蓝色理想 作者:mienflying 2007年11月19日 10:48 网友评论:0条 点击:

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像素处,从而用户看不到它们。

首页 上一页 [1] [2] [3] 下一页 尾页
上一篇:Unobtrusive的Web开发   下一篇:body的背景图填充IE和Firefox有区别
收藏此页】【打印】【关闭
 相关文章  我要点评
·CSS样式指南:提高CSS代码的可读性
·CSS Hacks 和问题解决
·CSS Hack整理
·面向对象的XHTML与CSS编程
·SEO:细节决定成败-CSS篇
·CSS模块化设计——从空格谈起
·常用CSS长度单位
·CSS框架的利与弊

免责声明:本站刊载此文不代表同意其说法或描述,仅为提供更多信息,也不构成任何建议。对本文有任何异议,请联络:68design#163.com
转载要求:作者及来源信息必需保留。转载之图片、文件,链接请不要盗链到本站,且不准打上各自站点的水印。



关于我们 | 在线反馈 | 广告报价 | 友情链接 | 联系我们 | 免责声明 | 在线投稿 | 网站地图
Copyright © 2003-2007 68design.net, All Rights Reserve 【找网页设计师,当然上网页设计师联盟】