CSS让文本框边框变为一条虚直线_表单按钮特效

模板酷站
  •       3/5
  •       1
  •       2
  •       3
  •       4
  •       5
查看演示效果

      织梦DedeCMS视频教程买空间 租服务器 选网硕互联! 无忧站长工具,百度权重一键全查!

      是不是有时候看到别人的表单很漂亮,文本框变成了一条直线或一条虚线,就像在稿纸上写字一样,其实这个效果用CSS实现起来并不复杂,主要是定义input元素的border属性,看下示例相信你能看得懂。

      <html> <head> <meta http-equiv="Content-Type" mrc="text/html; charset=gb2312"> <title>文本框边框变直线</title> <style> input{ color: #ff0000; background-color: #FFFFFF; border: #006699; border-style: dashed; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 1px; border-left-width: 0px"; } </style> </head> <body> <table width="279" border="0" cellpadding="0" cellspacing="0"> <tr> <td align="left"><p> <input size="41"><br> <input size="41"><br> <input size="41"><br> </td> </tr> </table> </body> </html>