[转]利用css3打造无图片圆角输入框
实现无图片的圆角输入框而烦恼吗,其实用css3新添加的radius属性就能轻松结局这个问题。其中-webkit-border-radius: 5px; 是chrome和safari的专有属性,-moz-border-radius: 5px;是firefoe的专有属性,当然,万恶的IE6是不支持这个属性的。
代码如下:
<!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>圆角输入框</title>
<style>
input {
background: #fff; border: 1px solid #000;
padding: 5px;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
}
</style>
</head>
<body>
<input class='inout' name='inout' type='text' value=''>
</body>
</html>