而不支持CSS3属性的浏览器你圆角是用图片模拟出来的 那么他也没有阴影的属性 所以也不会出现这样问题
所以你的问题就是给弄混了
在支持CSS3的浏览器上用自身的属性
在不支持CSS3的浏览器上用模拟的方法
还有在IE系列下你可以下一个CSS3的.HTC文件 他用微软自带的VML语法模拟出CSS3效果 具体的你可以百度
圆角、阴影、渐变这些属性在各个浏览器的兼容效果都不是很好,渐变就更不容易了,我们通常都是用作图软件来实现(通常也很好实现)兼容不好为什么还会有这些属性呢?
目前来说,低版本的浏览器的兼容效果都不是很好,高版本的浏览器都会实现不同的兼容效果,所以,存在有他的意义,在未来随着用户的需求越来越多,就会使用的越来越多,浏览器的兼容会变得越来越好,就类似W3C标准的出现一样。
两种效果 一种是把图片做成大的背景但是这样有局限性 因为这样它不会根据页面的变化而变化了
另一种方法是我推荐的方法
把底部圆角那儿切出来叫top.jpg
底部叫foot.jpg
中间的叫bg.jpg
<div style=" background:url(这里是bg.jpg) repeat-y left top">
<div>这里放head.jpg图片</div>
<div>这里就是你想要写的内容随便放什么都可以的</div>
<div>这里放foot.jpg图片</div>
</div>
这样的效果你看下吧 肯定是最简单最方便实现你现在这种效果的
而且会根据内容的大小而变化。
另一种
文本框用input,<input type="text" class="txtnput" value=""/>
.txtnput{float: leftwidth:126pxheight:27pxbackground:url(图片路劲)border:none}
高度和宽度是你效果图中你需要的那种文本框的大小,背景图片也是你需要的那种框。
按钮也是一样的实现。