在项目中遇到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. mvc路由

    一.路由常规设置 1.URL模式     路由系统用一组路由来实现它的功能.这些路由共同组成了应用程序的URL架构或方案. URL的两个关键行为:     a.URL模式是保守的,因而只匹配与模式具有 ...

  2. JVM client模式和Server模式的区别

    在“你知道自己执行的是哪个jre吗?”一文中我们知道安装JDK时会安装了两套JRE:专用和公用,殊不知这两套JRE还有秘密. 专用和公用JRE的不同 不同点在于专用JRE的bin里不仅有“client ...

  3. 阿里宣布Atlas正式开源：带你重返App开发的田园时代

    继Weex之后,阿里在移动技术领域又有开源大动作. 3月13日,手机淘宝安卓客户端容器化框架Atlas正式宣布开源(https://github.com/alibaba/atlas ).Atlas由阿 ...

  4. C++primer拾遗（第一章：开始）

    本系列将总结正在阅读的C++primer这本书中值得注意又容易忘记的知识点. 1. 当return语句包括一个值时,次返回值的类型必须与函数返回类型相同. 2. 操纵符 endl.写入该符号的效果是: ...

  5. mongodb选型问题

    一.Mongodb的介绍 MongoDB 是一个跨平台的,面向文档的数据库,提供高性能,高可用性和可扩展性方便. MongoDB工作在收集和文件的概念. 数据库 数据库是一个物理容器集合.每个数据库都 ...

  6. ps-抠图

    1-    图层区—复制背景图层            防止原图修改失败后无法还原 2-    工具栏——磁性套索工具                    可以有效的对色彩边线较为明显的图片进行抠图 ...

  7. 1.WP8.1开发_去除闪动效果，直接进入首页

    有时候希望打开软件的时候,不出现闪屏,而直接进入到第一个页面. 把第一个页面作为闪屏,可以制作一些进度条  和动画等... 很简单,有两种方法去除闪屏. 1.删除项目下 Assets 文件夹里面的Sp ...

  8. 使用 POJO 对象绑定请求参数

    概述 Spring MVC 会按请求参数名和 POJO 属性名进行自动匹配,自动为该对象填充属性值并且支持级联属性.这一特性在日常开发过程中使用频率比较高,开发效率也高,本文主要对 POJO 对象绑定 ...

  9. c#中遍历各种数据集合的方法

    1.遍历枚举类型 补:typeof()方法中只能传具体的类名.类型名称(int32...),不可以是变量名称.类似的方法有GetType(),GteType()方法继承自object,所以c#中任何对 ...

  10. 一个基于php+mysql的外卖订餐网站（带源码）

    订饭组 一个基于php+mysql的外卖订餐网站,包括前端和后台.源码地址 源码演示地址:http://dingfanzu.com 商家后台系统:http://dingfanzu.com/admin ...