在项目中遇到input的placeholder在safari下设置行高失效的问题，问度娘后未得治原因，倒是有解决办法：
方法一：使用padding使提示文字居中，如果font-size:14px,UI高度为40px,我们可以设height：14px,padding:13px 0;
方法二：使用line-height:1px
方法三：使用vertical-align: middle;
实践后问题得以解决，但是其他浏览器下也受到了影响，那么问题来了，我们需要单独针对Safari来写hack即[;line-height:1;]
至此，问题完美解决

css系列：input的placeholder在safari下设置行高失效的更多相关文章

  1. css设置input中placeholder字体

    设置input中placeholder字体颜色 input::-webkit-input-placeholder {color:@a;} input:-moz-placeholder {color:@ ...

  2. 如何用css给input的placeholder设置颜色

    我在做页面的时候遇到过这种情况,在input标签中有默认字,但是设计稿上的颜色和input标签中的placeholder的默认颜色不一致.虽然我们可以在js中写出,但是有点过于麻烦了. 所以我就用cs ...

  3. css 修改input中placeholder提示问题颜色

    input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: rgba(74, 87, 103, 1); ...

  4. css改变input输入框placeholder值颜色

    ::-webkit-input-placeholder { /* WebKit browsers */ color: #fff; } :-moz-placeholder { /* Mozilla Fi ...

  5. 在safari下input的placeholder设置行高失效

    在项目中遇到input的placeholder在safari下设置行高失效的问题,亲测 input{ width:250px; height:30px; line-height:30px; font- ...

  6. input 的 placeholder属性在IE8下的兼容处理

    placeholder是input标签的新属性,在使用的时候有两个问题: 1.IE8 下不兼容 处理思路: 如果浏览器不识别placeholder属性,给input添加类名placeholder,模仿 ...

  7. css系列教程1-选择器全解

    全栈工程师开发手册 (作者:栾鹏) 一个demo学会css css系列教程1-选择器全解 css系列教程2-样式操作全解 css选择器全解: css选择器包括:基本选择器.属性选择器.伪类选择器.伪元 ...

  8. ie8的input的placeholder不显示的解决bug

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  9. 解决input 中placeholder的那些神坑

    **昨天后台小哥哥提到placehold无法显示问题,我这边总结一下,顺便写个小文章分享给大家..** ============================================== 一 ...

随机推荐

  1. 2017-3-10 SQL server 数据库 T--SQL语句

    创建数据库:create datebase  数据库名     注:数据库名不能为中文,不能数字开头,不能符号开头. 删除数据库:drop datebase 数据库名 创建表:create   tab ...

  2. Visual Studio 2017 通过SSH 调试Linux 上.NET Core

    Visual Studio 2017 通过SSH 调试Linux 上.NET Core 应用程序. 本文环境 开发环境:Win10 x64 Visual Studio 2017 部署环境:Ubuntu ...

  3. Linux实战教学笔记25:自动化运维工具之ansible (一)

    第二十五节 ansible之文件的批量分发 标签(空格分隔): Linux实战教学笔记-陈思齐 ---本教学笔记是本人学习和工作生涯中的摘记整理而成,此为初稿(尚有诸多不完善之处),为原创作品,允许转 ...

  4. (14)jdk1.5开始的一些新特性：静态导入,增强for循环，可变参数，自动装箱/拆箱，枚举类型

    Jdk1.5新特性之静态导入 jdk1.5新特性值静态导入 静态导入的作用:简化缩写 静态导入的作用:可以作用一个类的所有静态成员. 静态导入的格式:import static 包名.类名.静态的成员 ...

  5. CSS学习之选择器

    html是盖房子,css是将房子装扮的更漂亮一些!CSS(Cascading Style Sheets),值层叠样式表. 语法 选择器 { 属性 : 属性值 ; } 比如, p{color:red;} ...

  6. .Net轻量级ORM-NPoco的使用方法-摘自NPoco国外官方Wiki

    文章引用自NPoco官方Wiki,地址:https://github.com/schotime/NPoco/wiki,因公司网络不稳定,有时无法访问,特将其摘抄. Home Adam Schroder ...

  7. fastjson升级版本遇到的问题

    前面的话: 有关阿里的fastjson升级时遇到的问题,链接如下 https://github.com/alibaba/fastjson/wiki/enable_autotype 我要说的,是我碰到这 ...

  8. 线程同步synchronized，Class与Object

    synchronized (class):class类的同步,同步的时候会同步整个class 与 synchronized (Object):Object的同步,只对其中的对象同步 如下:对类B中的同 ...

  9. lvm的vg扩容

    本次扩容的目的是要扩展 / 的整体容量,具体操作如下: 1.首先查看是否存在未分配的磁盘 [root@NH-Test-44 ~]# fdisk -l Disk /dev/vda: 53.7 GB, 5 ...

  10. (转)开源分布式搜索平台ELK(Elasticsearch+Logstash+Kibana)入门学习资源索引

    Github, Soundcloud, FogCreek, Stackoverflow, Foursquare,等公司通过elasticsearch提供搜索或大规模日志分析可视化等服务.博主近4个月搜 ...