如何用CSS实现圆角框?

来源:百度知道 编辑:UC知道 时间:2024/05/10 14:36:37
如图,用纯CSS(不用图片)来实现这样的框,宽度和高度能自适应的,可以做的话请说明详细些,有加分!
我需要的是兼容性强的表现方式..
如果一定需要图片的话,请尽量说得明白一些.
谢谢.!
另:我希望框能根据里面的内容来自动扩展,应该要怎么做?

纯CSS做的...

复制代码保存为网页文件即可...

圆角外是透明的,不受下层背景色影响

给你做了有边框和无边框的两个算法,

好好研究下就明白...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>

<html xmlns="http://www.w3.org/1999/xhtml";>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>CSS圆角</title>

<style type="text/css">

.round { width:200px; left:100px; top:100px; position:absolute; background:none; overflow:none;}

.round_conner{ background:none; overflow:none;}

.round_body{ height:190px; back