码迷,mamicode.com
首页 > 其他好文 > 详细

更加美化输入框的方法

时间:2017-12-24 11:13:03      阅读:104      评论:0      收藏:0      [点我收藏+]

标签:输入   改变   add   设计   系统   input   获取   border   class   

在使用input输入框的时候经常会遇到想要让输入框里显示的内容变得更加漂亮多样

今天我和大家分享的就是如何使输入框设计得更适合自己的想法。

首先,我们创建一个输入框input

然后我们就可以使用

padding-left:n px;(n是作者自己设定)

这段代码的作用是使输入框的内容缩进,不过它也会使边框的宽度增加,

所以增加了多少缩进,就得减少多少边框的宽度。

border:1px solid red;(粗细,样式,颜色)

这段代码的作用是设定输入框的边框的粗细样式和颜色,也会增加边框的宽高。

outline:none;

这段代码可以使用户点击输入框的时候,输入框不会被焦点获取,也就是不会在获取焦点后被系统改变边框颜色。

更加美化输入框的方法

标签:输入   改变   add   设计   系统   input   获取   border   class   

原文地址:http://www.cnblogs.com/SeiAoi/p/8095210.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!