CSS中渐变背景的使用以及注意事项

在IE浏览其中,使用滤镜可以产生很多好看的效果。渐变色是其中的一种。方式如下:

filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr="#ffffff",endColorStr="#336699",gradientType="1");

分别设置起始颜色与结束颜色,gradientType设置方向,1为横向,0为纵向。

用于设置背景的对象必须指定其高度或者宽度,否则将没有效果。

在调试的时候发现,属性与值之间不能有任何空格,否则将会导致后续的CSS定义全部失效,自身定义也有点问题。

让我疑惑的是,我在一个网站上http://www.okajax.com/Index.html 这个网页上查看的时候,发现其CSS文件中是有空格的,但是显示还是正确的。在自己编写代码的时候就不行了。值得注意的是,该主页中设置的是表格单元格的背景,而我设置的是div对象的背景,而且我使用的文档类型是<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">,而该主页没有注明文档标准。

注:后通过将本人编写的网页去掉文档类型后发现,属性与值间有空格也可以了。这表示XHTML1.0标准中是不允许出现属性与值之间出现空格的,导致后续的CSS设置没有任何效果。相对于没有指定任何文档类型的情况而言,IE浏览器解释的时候更为严格。

本次示例也提醒我一件事,照搬代码的时候还需要考虑不同的文档类型导致的IE浏览器解释效果不同,同时在编写代码的时候,要注意,严格遵守编写规则。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值