zoukankan      html  css  js  c++  java
  • CSS实例:横线样式的输入框

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

       示例如下:

       请输入您的用户名:




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


      



      样式表中代码解释如下:

      “BORDER-LEFT-STYLE:none”: 隐藏左边框
      “BORDER-RIGHT-STYLE: none”: 隐藏右边框
      “BORDER-TOP-STYLE: none”: 隐藏上边框
      “BORDER-bottom-STYLE: none”: 隐藏下边框。


      下面让我们一起来看一个应用实例:        横线式输入框   

      

           隐藏的边框的输入框:   

    用户名:      

        
      实现效果简洁清爽。 

  • 相关阅读:
    Lua 学习之基础篇七<Lua Module,Package介绍>
    Lua 学习之基础篇六<Lua IO 库>
    Lua 学习之基础篇五<Lua OS 库>
    Lua 学习之基础篇四<Lua table(表)>
    Lua 学习之基础篇三<Lua 字符串操作>
    时空穿梭
    【集训队作业】line
    动态几何问题
    博弈论与概率统计
    wombats
  • 原文地址:https://www.cnblogs.com/activities/p/2975463.html
Copyright © 2011-2022 走看看