用CSS“层”做出小米的logo,为什么我的是错的?【高赏】

html-css015

用CSS“层”做出小米的logo,为什么我的是错的?【高赏】,第1张

1、首先#big左浮动和#right右浮动,right你没有右浮动,right右浮动后设备宽高。

2、#heart不要设上边距,#small 设上填充,并更改相应数值。

3、CSS边框半径,很多浏览器不支持,改后在我电脑上只有360 6.3正常显示。

#big的圆角建议用背景图片做,这并没有改变纯CSS制做的原则。

以下为改动地方:

#heart {

width:33px

height: 77px

margin-left: 28px

margin-right: 28px

background-color:orange

display: block

}

#small {

width:89px

height: 77px

margin-left: 35px

margin-top: 35px

margin-right: 35px

background-color:white

border-radius: 0px 19px 0px 0px

padding-top: 28px

}

增加:

#right {

float: right

height: 140px

width: 33px

background-color: #FFA500

}

你确定他支持了ie内核的圆角?

这是ie8下面的截图

这是chrome下的截图

很明显,根本就没有支持。

他的搜索框、导航条,都是用背景或border实现的。所以你不管怎么调,ie都不会支持。要想所有主流浏览器同时兼容(包括ie6),就只有用图片来做圆角或者引用一个 PIE.htc文件让ie6-8版本都支持css3属性。