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”: 隐藏下边框。


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

      

           隐藏的边框的输入框:   

    用户名:      

        
      实现效果简洁清爽。 

  • 相关阅读:
    音频重采样48kk转16k
    ld: symbol(s) not found for architecture x86_64问题解决
    麦克风啸叫抑制解决方案之移频法
    gcc makefile 模板
    mysql 分组加序号
    java微信公众号JSAPI支付以及所遇到的坑
    appium新手入门(1)—— appium介绍
    一次完整的JVM堆外内存泄漏故障排查记录
    mysql 批量更改表名
    爬虫技术
  • 原文地址:https://www.cnblogs.com/activities/p/2975463.html
Copyright © 2011-2022 走看看