合买大神
网站首页 网站建设 公司动态 行业新闻 案例展示 关于我们

文章内容

CSS hacks与争议

日期:2013-12-16  来源:攀枝花惠康网络公司

margin-right: -300px;

1、声名本文阐述了我们发现的在用CSS设计中有用的解决方案。

要去除水平滚动条,可以在body中插入overflow-x:hidden属性。

outline:none;

.container {

IE6以下

*html{}

*:first-child+html {} * html {}

只对IE 7

*:first-child+html {}

html>body {}

只对现代浏览器(非IE 7)

html>/**/body {}

最新的Opera 9以下版本

text-indent: -5000px;

Safari

html[xmlns*=”"] body:last-child {}

要使用这些选择器,请在样式前写下这些代码。例如:

#content-box {

height: 150px;

}

* html #content-box {

width: 250px;

只对IE 7 和现代浏览器

}

/* 重写膳缦沔的代码而且把宽度改为250PX

在IE6以下版本中合用。 */

3、在IE6中使用透明PNG?#35745;?/p>

IE6的一个很难措置的BUG就是它不撑持透明PNG?#35745;?/p>

你可能需要用一个重写的CSS的?#21496;?#26469;解决这个问题:

*html #image-style {

background-image: none;

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=http://www.css88.com/archives/”fil

}

4、去失踪毗连虚线框

当你点击链接时,Firefox会在链接四周发生一个虚线外框。

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

position: relative;

a{

}

当你想在一个浏览器里改变样式而不像在其他浏览器中改变时,这些选择器很有用。

5、对inline元素应用宽度。

如不美观你对一个inline元素使用宽度,它将只在IE6下起浸染。

* html .container {

2、浏览器特定的选择器

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

你不能节制inilne标签的宽带,不外有一个体例?#21069;?#26631;签属性年夜inline改为Block。

9、潜匿水平滚动

span{

position: relative;

width:150px;

display:block;

}

应用display:block能够把span标签酿成block标签,年夜而节制它的宽度。

6、使也述固定宽度的网站居中。

#wrapper {

margin: auto;

}

7、?#35745;?#26367;代手艺

对于头部来说,永远是最好用文字而不是?#35745;?#22312;你必需要用?#35745;?#30340;某个非凡处所最好使?#20204;?#21311;文字的层的布景?#35745;?#36825;对于屏幕阅读和seo很是有用,尽管依然使用很通俗的文字,这可以联想到所有的利益。

HTML:

CSS:

h1 {

background: url(heading-image.gif) no-repeat;

}

h1 span {

position:absolute;


width: 300px;

}

正如你所见,我们对H1标签使用通俗的HTML代码,用CSS来将?#35745;?#26367;代文字。Text-indent把文字放到左边5000像素处,年夜而用户看不到它们。

8、最小宽度

ename.png”, sizingMethod=”scale”);

IE的此吐?#29992;鯞ug就是它不撑持min-width属性。min-width确实很是有用,出格是对于100%宽度的可变模板来说,因为他告诉浏览器遏制缩短。

html:first-child {}

min-width:300px;

}

要让这些在IE6下起浸染的话你要添加额外的全力!你需要建树两个DIV,一个包含着另一个。

IE 7 以下

<div class=”container”>

<div class=”holder”>Content</div>

</div>

然后你需要设置外面层的min-width:

.container {

min-width:300px;

}

此刻又要IE hack起浸染了,你需要写下以下代码:

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

border-right: 300px solid #FFF;

}

* html .holder {

display: inline-block;

}

当浏览器窗口调整外层宽度来顺应直到它缩小到border的宽度时,这个时辰它就不能够在缩小了。而holder层?#19981;?#36943;制缩短。外层的边框宽度酿成了内层的最小宽度。

body {

对于除IE6以外的所有浏览器来?#30340;?#21482;需min-width:xpx;例如:

overflow-x: hidden;

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

}

这在你决意要用一个比浏览器款的?#35745;?#25110;Flash时很有用。

翻译声名:这是Solid State Group网站上的一篇很友好的文章,解决了我的良多问题。在此我翻译其文,并对原作者暗示很是?#34892;?#24863;动!原文地址: http://www.solidstategroup.com/page/1592

文章来源:攀枝花惠康网络公司

惠康网络,?#19988;?#23478;专业从事攀枝花网站建设,攀枝花网站制作,攀枝花网站设计公司,提供网站建设一条龙服务(网站域名注册+网站服务器租用+网站开发+网站维护+网站营销推广),惠康网络立足攀枝花,辐射全中国,攀枝花惠康网络的客户已经遍布国内各地大?#34892;?#22478;市,我们高效优质的网站建设服务深受用户好评。

?#22836;?#28909;线:tel(谢先生)  ?#22836;Q:1323605005  
服务邮箱:[email protected](售前咨询)  [email protected](技术部)  [email protected](售后服务)
公司地址:四川省攀枝花市
?#26102;啵?/span>617200

合买大神 海南飞鱼游戏玩法 北京pk10高手计划群 水果大转轮试玩 法兰克福展会 北京pk10有什么技巧 史前丛林冒险投注 韦斯卡vs巴萨罗那 天津十一选五开奖结果手机版 柔佛dt什么水平 皇家贝蒂斯西班牙人