让placeholder中的默认文字居中,或者缩进多少像素
直接给input或者textarea的样式加texta-align:center;
<input type="" name="" id="" value="" placeholder="信息" />
::-webkit-input-placeholder {
color: #f00;
text-align:center;
}

如果想要让提示文字距离边框有一定的距离,将text-align:center;去掉,加padding-left就可以

下面是兼容性写法
/* WebKit browsers */
::-webkit-input-placeholder {
padding-left: 50px;
color: #777;
}
/* Mozilla Firefox 4 to 18 */
:-moz-placeholder {
color: #777;
opacity: 1;
}
/* Mozilla Firefox 19+ */
::-moz-placeholder {
color: #777;
opacity: 1;
}
/* Internet Explorer 10+ */
:-ms-input-placeholder {
color: #777;
}
Internet Explorer 10、Firefox、Opera、Chrome 以及 Safari 支持 placeholder 属性。
注释:Internet Explorer 9 以及更早的版本不支持 placeholder 属性。
让placeholder中的默认文字居中,或者缩进多少像素的更多相关文章
- Js制作点击输入框时默认文字消失的效果
(从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-02-17) 为了提高用户体验和易用度,一些设计师会对网页中用户经常用的东西进行优化,比如输入框.一般的输入框是怎样优化的呢 ...
- 关于placeholder中 文字添加换行 用转义字符 代替<br>
今天遇到一个问题 UI给的效果图中 文本域的提示文字 是两行显示, 于是就想到placeholder中能否解析html标签, 尝试后发现并无卵用, 经过调查后发现 可以用转义字符代替<br> ...
- 让Spinner中的文字居中
如果套用simple_spinner_item或是simple_spinner_dropdown_item,然后直接在Spinner中用 android:gravity="center&qu ...
- [Android]Android 布局中如何让图片和文字居中显示?
图片文字居中显示 **①组件TextView的属性 drawableTop ``` <LinearLayout android:layout_width="match_parent&q ...
- 利用VBA宏批量解决Word中图片大小、居中设置
需求:经常阅读网上的研报(没钱买排版漂亮的高质量研报),有些需要保存的复制下来到word里,图片很大都超出word的边界了,也没有居中,手工一张张调整不现实,上百页的研报,几十张图片. 解决方案:利用 ...
- Android ToolBar标题文字居中的方法
在项目的开发中,使用苹果手机的产品,出的界面效果图极有可能(我这里是一定)完全是按照苹果的界面风格来出的,例如界面顶部的title文字位置是水平居中 如图: 那么问题来了,当我们使用ToolBar控件 ...
- event.srcElement在火狐(FireFox)下的兼容问题。搜索框获得焦点时默认文字变化
前言: 项目中用到了一个功能,搜索框里有默认的文字,当搜索框获得焦点时里面的默认文字消失,如果失去焦点时搜索框内容为空则让里面的内容回复默认!,. 实现: 很轻松的在网上找到了类似代码 $(" ...
- Android TextView 文字居中
有2种方法可以设置TextView文字居中: 一:在xml文件设置:android:gravity="center" 二:在程序中设置:m_TxtTitle.setGravity( ...
- 设置TextView文字居中
有2种方法可以设置TextView文字居中: 一:在xml文件设置:android:gravity="center" 二:在程序中设置:m_TxtTitle.setGravity( ...
随机推荐
- SQLSERVER 链接服务器执行存储过程
1.创建链接服务器 exec sp_addlinkedserver 'server_tmp','','SQLOLEDB','192.168.1.1' -- server_tmp 为别名 exec sp ...
- JAVA-mysql读写分离插件介绍
kingshard是一个由Go开发高性能MySQL Proxy项目,kingshard在满足基本的读写分离的功能上,致力于简化MySQL分库分表操作:能够让DBA通过kingshard轻松平滑地实现M ...
- 常规RPC通讯过程【转载】
在 HTTP2 协议正式开始工作前, 如果已经知道服务器是 HTTP2 的服务器, 通讯流程如下: 客户端必须首先发送一个连接序言,其逻辑结构: PRI * HTTP/2.0\r\n\r\nSM\r\ ...
- linux进程的有效用户ID
进程的有效用户ID用于文件访问时的权限检查.通常,有效用户ID等于实际用户ID(也就是你登录是的用户ID),有效组ID等于实际组ID. 我们知道每个文件针对不同的user有不同的读.写.执行权限.当执 ...
- Pyhton学习——Day9
#文件操作的其他方法 ###############################################################################文件的内置操作函数# ...
- (fields.E304) Reverse accessor for 'UserProfile.groups' clashes with reverse accessor for 'User.groups'.
创建数据库models.py,在进行数据迁移时抛出一下异常: E:\Project\GuoJia>python manage.py makemigrations SystemCheckError ...
- 使用jd-gui+javassist修改已编译好的class文件
1.原因:因为公司代码管理不当导致源码丢失,只好已编译好的class文件进行修改 2.首先先在myeclipse中新建java项目并导入javassist 3.将需要修改的文件放到指定文件夹下 4.. ...
- elementUI 上传.csv文件不成功 导入功能
前言:element上传excel文件 导入功能 目标:点击导入,将excel表格的数据填充到表格. <el-upload class="upload-demo" :ac ...
- HDU 1023 Train Problem II( 大数卡特兰 )
链接:传送门 题意:裸卡特兰数,但是必须用大数做 balabala:上交高精度模板题,增加一下熟悉度 /************************************************ ...
- Lapack下载安装
安装 1.下载压缩文件 wget http://www.netlib.org/lapack/lapack-3.8.0.tar.gz 2.解压缩 tar -zxvf lapack-3.8.0.tar.g ...