纯CSS打造支持IE6的无图片圆角教程
- 作者：网页模板
- 类型：图文教程
- 点击次数：
- 发布时间：2014-03-28 09:27
先运行下面的代码查看效果，可以再IE6下测试，绝对兼容：
今天这种方法，既不是css3，也不是图片，兼容IE6还实现了无图化。
1、现在外面定义一个大的容器，如div，定义了宽高，最好overflow:hidden；
2、在里面加div或者别的块标签，一定不要有外间距和内间距，可以重置下，如h1、p等。三四个，从上至下，高度都为0，宽度不设置，上下margin都为0，左右间距从例如4开始逐渐减为1。设置一致的但不同于外面div的颜色；
3、中间放内容，中间容器颜色和第二步里面的颜色一样
4、底部和第二步一样，只是左右margin反过来即可。
(责任编辑：网页模板)
提示：您可以先修改部分代码再运行
今天这种方法，既不是css3，也不是图片，兼容IE6还实现了无图化。
1、现在外面定义一个大的容器，如div，定义了宽高，最好overflow:hidden；
2、在里面加div或者别的块标签，一定不要有外间距和内间距，可以重置下，如h1、p等。三四个，从上至下，高度都为0，宽度不设置，上下margin都为0，左右间距从例如4开始逐渐减为1。设置一致的但不同于外面div的颜色；
3、中间放内容，中间容器颜色和第二步里面的颜色一样
4、底部和第二步一样，只是左右margin反过来即可。
(责任编辑：网页模板)
- 本文标签：
- CSS圆角
