在项目中遇到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. smarty模板做人员表信息删除,修改 里面的性别单选按钮民族下拉,另外登录进去可以显示姓名

    首先登录进去可以显示姓名 smarty模板做人员表信息删除,删除的时候有提示框确定删除吗. 修改 里面的性别单选按钮,要修改谁有默认选中,用了变量调节器 民族位置做下拉,用<{foreach}& ...

  2. 2017-02-23 switch case 循环语句

    另一个分支语句:switch..case.. switch(变量){    case 值:代码段;break;    case 值:代码段;break;    ...    default:代码段;b ...

  3. Mac OSX Sierra WiFi connecting problem

    吐槽一下,苹果的质量管控越来越差了. Mac OSX Sierra有时突然或升级后会遇到wifi不停重连连不上问题,现象为不停地连接wifi. 网上有人说删除 /Library/Preferences ...

  4. weblogic 双机集群搭建

    weblogic 双机集群搭建,基本步骤引用百度文库的一篇文章: wenlogic双机集群基本步骤 下面详解一下该文章搭建后会遇到的问题: 1. 主机名验证失败 javax.net.ssl.SSLKe ...

  5. 3359: [Usaco2004 Jan]矩形

    3359: [Usaco2004 Jan]矩形 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 8  Solved: 5[Submit][Status] ...

  6. JAVA高级总结

    一.集合框架和泛型 1.集合框架 1) 定义:JAVA API的一部分,用于处理一组长度可变得数据. 2) 和数组的区别: 数组的长度不可变,但是集合框架处理的数据长度可以动态变化. 3) 结构: 接 ...

  7. ajax 提交表单(文件)

    废话不多说,自己看代码 引入的jquery <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js&quo ...

  8. sublime text笔记

    sublime text确实是一个很不错的编辑器,而且还是跨平台的,这个很不错.---Linux V2.0.2 有些时候可以比VIM要好有些 1.安装: apt-get install sublime ...

  9. spdlog源码阅读 (3): log_msg和BasicWriter

    4. log_msg和它的打手BasicWriter 在spdlog源码阅读 (2): sinks的创建和使用中,提到log_msg提供了存储日志的功能.那么到底在spdlog中它是怎么 起到这个作用 ...

  10. Java标准注释配置

    eclipse中java文件头注释格式设置 windows->preferences->java->Code Templates->comments->Type-> ...