Html5输入框支持placeholder,但是在定义文本框中定义placeholder存在兼容问题

<input type="text" placeholder="search word" name="p" />  

但是在chrome下显示的search word并不能垂直居中。

在stackoverflow上找到了对应的方法。参考地址:http://stackoverflow.com/questions/4919680/html5-placeholder-css-padding-problem

解决方法是:

把line-height设置为normal

CSS定义如下

input{
  line-height: normal; /* for non-ie */
  line-height: 22px\9; /* for ie */
}

input placeholder文字垂直居中(Mobile & PC)的更多相关文章

  1. input placeholder 文字颜色修改

    placeholder 文字颜色修改 input::-webkit-input-placeholder{ color:red; } input::-moz-placeholder{ /* Mozill ...

  2. 设置input框文字垂直居中和宽度

    input { solid #999;height:22px; background:#ffffff; line-height:22px; margin:0px; padding:0px;/*表单输入 ...

  3. 如何让textarea placeholder 文字垂直居中

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  4. HTML5 Placeholder实现input背景文字提示效果

    这篇文章我们来看看什么是input输入框背景文字提示效果,如下图所示: 这种效果现在网上非常的普遍流行,但大部分是使用JavaScript实现的.但HTML5给我们提供了新的纯HTML的实现方式,不需 ...

  5. 小程序中点击input控件键盘弹出时placeholder文字上移

    最近做的一个小程序项目中,出现了点击input控件键盘弹出时placeholder文字上移,刚开始以为是软键盘弹出布局上移问题是传说中典型的fixed 软键盘顶起问题,因此采纳了网上搜到的" ...

  6. css常用技巧:input提示文字;placeholder字体修改

    1 很多网站都需要更改 <input>内部的placeholder 文字颜色属性:下面来介绍下这个技巧. 2  源代码: <!DOCTYPE html><html> ...

  7. placeholder文字颜色与是否显示兼容性

    1.ie显示问题 <script type="text/javascript"> $(document).ready(function(){ var doc=docum ...

  8. HTML 5 <input> placeholder 属性

    原文链接:http://www.w3school.com.cn/html5/att_input_placeholder.asp HTML 5 <input> placeholder 属性 ...

  9. 移动Web单行文字垂直居中的问题

    单行文字垂直居中的方式你可能可以脱口而出,height和line-height设置为同样就行了,或者设置相同的padding-top和padding-bottom值. 上图是Chrome浏览器下的效果 ...

随机推荐

  1. Adatper中获取宽高为0的问题

    但是我们想在getView()中获取ImageView的宽和高存在问题,在getView()里面刚开始显示item的时候利用ImageView.getWidth() 获取的都是0,为什么刚开始获取不到 ...

  2. android tips—启动Emergency call拨号盘

    Intent intent = new Intent(); intent.setAction("com.android.phone.EmergencyDialer.DIAL"); ...

  3. Java基础知识强化之集合框架笔记14:List集合存储字符串并遍历

    1. List集合存储学生对象并遍历: 需求:存储字符串并遍历 分析: (1)创建集合对象 (2)创建字符串对象 (3)添加字符串对象到集合中 (4)遍历集合 2. 代码示例: package cn. ...

  4. 运行yum报错:Error: Cannot retrieve metalink for repository: epel. Please verify its path

    Error: Cannot retrieve metalink for repository: epel. Please verify its path and try again 当我们安装第三方扩 ...

  5. win 10 安装 mysql解压版 步骤

    参考资料:win 10 安装 mysql 5.7 网址:http://blog.sina.com.cn/s/blog_5f39af320102wbk0.html 本文参考上面的网址的教程,感谢作者分享 ...

  6. 自己写的demo。List<HashMap<String,Object>>=new ArrayList<HashMap<String,Object>>

    package com.pb.collection; import java.util.ArrayList; import java.util.HashMap; import java.util.It ...

  7. mysql隐藏文件一定要删除彻底

    之前部署自己的服务器机器的时候 机器的mysql密码是不知道的.彻底删除了软件之后还是解决不了问题,而且我把MYSQL在C盘的隐藏文件也给删除了.但是还是不行 最后我偶然发现一个方法去找隐藏问题.我之 ...

  8. U3D 实现子弹发射效果

    首先,这里子弹要模拟的相似的话,用2D刚体比较好,会有重力,自由落体运动. using UnityEngine; using System.Collections; public class gun ...

  9. apache httpd配置ajp报错:ap_proxy_connect_backend disabling worker for (localhost)

    报错信息: (13)Permission denied: proxy: AJP: attempt to connect to 127.0.0.1:9019 (localhost) failed[Wed ...

  10. while read line无法循环read文件

    while read line 与for循环的区别 例子:要从一个ip列表中获取ip.port,然后ssh ip 到目标机器进行特定的command操作ssh -o StrictHostKeyChec ...