网络编程
位置:首页>> 网络编程>> 网页设计>> CSS代码实现下划线样式的输入框效果

CSS代码实现下划线样式的输入框效果

作者:佚名  发布时间:2010-03-16 12:42:00 

标签:样式,css,输入框

在网上我们常常看见一些注册表单的输入框部分并不是我们常见的矩形框,而是一条细线,很多朋友对此很感兴趣。其实要实现这样的效果并不困难,我们只要用一段简短的CSS代码控制好表单输入框的样式即可。
   示例效果图如下:   

下面我们就来看看这段实现效果的css代码。它主要运用了表格边框的样式控制,将左、上、右边框设置为0,只剩下下边框即可。

<style type="text/css"> 
  <!-- 
  .line{  BORDER-RIGHT:   0px   solid;
   BORDER-TOP:   0px   solid; 
 BORDER-LEFT:   0px   solid;
 BORDER-BOTTOM:   1px   solid
  } 
  --> 
  </style>


  下面让我们一起来看一个应用实例:


0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com