修改 placeholder 样式,placeholder 换行 以及iOS 上设置placeholder被遮挡

2023-11-19

修改placeholder样式

/*通过选择器就可以简单的修改该placeholder的样式*/
input::placeholder{
    font-size:14px;
    color: #666666;
}

placeholder 换行

在input 里面很少用到,input 就只有一行而已,多行的话就会使用textarea标签,确实在textarea标签里面如何让placeholder 换行是一个麻烦事,由于不同浏览器兼容性还不一样.
这里提供一个简单的实现方法
jq_watermark,一个基于jQuery的小插件,min版本才2.8KB
使用方式
导入jQuery,导入jq_watermark, jq_watermark在github上的下载地址
给textarea 加上名为 jq_watermark 的class

    <textarea name="" class="jq_watermark" cols="110" rows="10" required placeholder="第一行<br/>第二行<br/>第三行"></textarea>

ios上的小坑

在苹果高版本上,iPhone6,7 上发现了一个小问题,就是当你设置placeholder显示的字体大小的时候,有时候会被遮挡掉一部分,这时候怎么解决?
解决方法:先设置input 里面的字体大小需要大于placeholder的字体大小^-^

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

修改 placeholder 样式,placeholder 换行 以及iOS 上设置placeholder被遮挡 的相关文章

  • CSS 内边框?

    我纯粹用 CSS 创建了左侧的按钮 它是一个div 中的一个div 然而 右侧的三个按钮是background属性于img标签 我这样做是为了按照以下说明模拟翻转效果here http kyleschaeffer com best prac
  • html 图像 src 调用 javaScript 变量

    这是我的代码 我想问 我怎样才能做到这一点 img src img apple 我一直在尝试使用 call 函数和 document onload 但它根本不起作用 有人可以救我吗 我假设你只是想用 javascript 更新图像 src
  • 什么可能导致 Firefox 中出现此 HTML/CSS 渲染问题?

    款式 h2 color 71D0FF font size 11px font weight bold margin 0px 0px 5px 0px a box color FFFFFF important cursor pointer di
  • IE localStorage 事件失火

    在 Internet Explorer 9 和 10 中 localStorage 实现意外地触发事件 这里有很棒的线索 Chrome 的 localStorage 实现存在错误 https stackoverflow com questi
  • 如何将两个 span 元素一个向左对齐,另一个向右对齐?

    我有两个 span 要素 span style margin right auto 2012 XYZ Corp All Rights Reserved span span style margin left auto Built with
  • 居中

    我的问题 http i56 tinypic com ff3jmo png http i56 tinypic com ff3jmo png 项目符号点未对齐 我要做的只是 text align center ing ul 所在的类 我可以对齐
  • 如何使用 Javascript 在 html 文件中搜索字符串?

    我有 5 个 html 文件 并且有一个搜索表单 我想用它来搜索这些 html 文件中的文本
  • 如何给URL添加变量?

    我正在尝试从网站收集数据 我有一个 Excel 文件 其中包含该网站的所有不同扩展名 F i www example com example2 我有一个脚本可以成功从网站中提取 HTML 但现在我想为所有扩展自动执行此操作 然而 当我说 s
  • 从后面的代码添加外部 css 文件

    我有一个 CSS 文件 例如 SomeStyle css 我是否可以将此样式表文档从其代码隐藏应用到 aspx 页面 您可以将文字控件添加到标头控件中 Page Header Controls Add new System Web UI L
  • 对于 android 系统,使用 Sencha Touch 或 Phonegap 哪一个更好? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 使用 ul 和 li 标签选择框

    我想插入 img 每个中的标签
  • 对翻译进行语义标记

    我正在标记一份历史手稿 该手稿已从德文翻译成英文 在网页上 我将并排提供两种语言 是否有一种可接受的方法来标记这种情况 我正在考虑使用部分标签分割翻译块并为每个翻译块提供一个 lang 属性 然而 从语义上讲 这无法传达一个部分与另一部分大
  • 集成引导模板的 ASP .Net MVC Web 应用程序

    我知道对于这个问题我可能会得到太多的反对票 但我只是找不到解决我的问题的教程 我在 Visual Studio 2013 中创建了一个 ASP Net MVC 项目 新项目 gt ASP NET Web 应用程序 gt MVC 我正在尝试更
  • Twitter Bootstrap 按钮组控制单选按钮/复选框

    我正在尝试使用Twitter Bootstrap 按钮组 http twitter github com bootstrap javascript html buttons作为一组实际的表单输入控件 默认情况下 这些按钮组的功能类似于单选按
  • 从标签中提取 HTML5 数据属性

    我想从标签中提取所有 HTML5 数据属性 就像这个 jQuery 插件 http www orangesoda net jquery dataset html 例如 给定 span class highlight Joe Bloggs s
  • 仅适用于 Firefox 的不同字体大小

    我只是为我的网站添加一个帐户标题 仅显示玩家的用户名 我正在使用自定义字体 它在 Chrome 和 IE 上运行良好 但是对于 Firefox 它不显示自定义字体 只显示下一个可用字体 即 Verdana 我不介意 但我的问题是 Verda
  • Polygonal Divs——让内容以特定形状溢出?

    这是我目前正在开发的网站 http willcrichton net http willcrichton net 如果单击中间六边形每一侧的箭头 您可以看到它使用 jQuery jQuery Cycle jQuery Easing 左右过渡
  • 某些网站如何在 iOS Safari 中内嵌播放视频?

    非常令人难以置信 因为我认为所有视频都可以在常规野生动物园中扩展为全屏播放 例如检查一下 https entertainment theonion com the onion reviews rogue one 1819596116 htt
  • 验证动态添加的输入字段

    我用过this http docs jquery com Plugins Validation以下表单的 jquery 验证插件
  • 如何在输入时格式化 contenteditable div?

    我正在尝试编写一个函数 允许 contenteditable div 在用户输入 div 时执行一些自动格式化 到目前为止我只能让它在 IE 中运行 有人可以帮助我吗 function formatOnKeyUp if window get

随机推荐

  • 软件测试中动态测试与静态测试的区别

    这里讲一下软件测试中动态测试与静态测试的区别 静态测试主要包括 1 代码检查 代码会审 代码走查 桌面检查 2 静态结构分析 3 代码质量度量 动态测试主要包括 1 黑盒测试 又称功能测试 这种方法把被测软件看成黑盒 在不考虑软件内部结构和
  • 2023年深圳杯数学建模A题影响城市居民身体健康的因素分析

    2023年深圳杯数学建模 A题 影响城市居民身体健康的因素分析 原题再现 以心脑血管疾病 糖尿病 恶性肿瘤以及慢性阻塞性肺病为代表的慢性非传染性疾病 以下简称慢性病 已经成为影响我国居民身体健康的重要问题 随着人们生活方式的改变 慢性病的患
  • Python中的常见问题与解决方案

    机器学习作为当今最热门的领域之一 为数据科学和人工智能带来了巨大的突破和进步 然而 在Python中进行机器学习和深度学习开发时 我们可能会遇到一些常见的问题 本文将分享一些这些常见问题 并给出解决方案 帮助您更好地进行机器学习和深度学习的
  • js 正则exec()函数在循环中使用

    在每次循环中 需要把正则表达式的lastIndex重置为0 如 reg lastIndex 0
  • Swift Codable 自定义默认值解码

    前言 最近我们公司服务端修改了某个接口返回数据结构 减少了一些字段 导致iOS这边codeable解码失败 获取不到正确的数据信息 相关业务无法完成 不想使用可选值类型 可以使用属性包装器实现对基础类型的包装 decode解析时给定默认值
  • 编写高质量代码:改善Java程序的151个建议(第7章:泛型和反射___建议101~109)

    我命由我不由天 哪吒 建议101 注意Class类的特殊性 建议102 适时选择getDeclaredXXX和getXXX 建议103 反射访问属性或方法时Accessible设置为true 建议104 使用forName动态加载类文件 建
  • CSS中设置表格TD宽度的问题

    CSS布局 表格宽度不听使唤的实例 想把表格第一例宽度设为20 其他自适应 但CSS中宽度是等宽的 只设这一行也不起作用 但是在实际应用中总是等宽处理 并不按照样式来走 XML HTML代码
  • Linux 添加ssh公钥 实现免密认证

    ssh 无密码登录要使用公钥与私钥 linux下可以用用ssh keygen生成公钥 私钥对 1 添加A服务器公钥到B服务器 2 到A服务器输入命令ssh keygen 一路回车 3 找到A服务器的 root ssh id rsa pub
  • Windows环境下3分钟就能安装一个Ubuntu

    作为一名IT人士 如果你手上没有一个私人的Linux环境是说不过去的 单独购买云服务器来搭建代价太高 用磁盘分区装双系统步骤也繁琐 那怎样在3分钟内快速搭建出一个私人的Linux环境呢 一 在Windows系统下 装Linux的常用方法是
  • Redis之hash类型

    文章目录 Redis之hash类型 1 设置一个字段 获取一个字段 2 获取所有字段值 3 判断字段是否存在 4 设置多个字段 获取多个字段 5 只获取字段名 字段值 6 获取某个key内全部数量 7 增加数字 8 删除key内字段 9 字
  • form表单传递对象数组

    ajax传递数组 form表单提交对象数组 在JSP页面开发中 我们常常会用到form表单做数据提交 由于以前一直只是使用 form表单提交单个对象 只要表单文本域的name值和接收的对象的属性名一致 那么传值就没有什么问题 不过 在前几天
  • 【狂神说Java】CSS快速入门

    目录 1 什么是CSS 11 什么是CSS 1 2 发展史 1 3 快速入门 1 4 CSS的三种导入方式 2 选择器 2 1 基本选择器 2 2 层次选择器 2 3 结构伪类选择器 2 4 属性选择器 常用 3 美化网页元素 3 1 为什
  • 【前端】菜单栏设计(html、css)

    先展示一下效果图 目录 一 代码 1 1 html 1 2 css 二 代码分析 2 1 浏览器配置 2 1 1 normalize css 2 1 2 html5shiv 2 2 html分析 2 css解析 一 代码 1 1 html
  • 源文件字符集,编译器内部字符集,执行字符集,控制台乱码问题,Qt中文问题

    源文件字符集 源文件本身也是文本文件 所以源文件字符集是指源文件保存时采用哪种字符集编码 VC 下源文件默认是gbk编码 如果想要更改 可以通过 文件 高级保存选项 修改某个源文件的编码方式 似乎没有什么选项能够设置创建项目时的源文件编码
  • 如何编写测试用例

    文章目录 测试用例的内容 等价类 边界值分析法 流程分析法 判定表法 正交试验法 测试用例的内容 用例编号 用于唯一的识别用例 能够根据用例编号识别我们测试所属的产品 模块 测试阶段等 一般格式为 A B C D A 一般用来表示产品或者项
  • Heating Up (单调栈,在环上选择一个点为起点,若有一边权值小于当前值,则吃掉那个点并获得相应贡献)

    https codeforces com gym 104064 problem H include
  • js计算两日期相差的天数、月数

    返回两个日期相差的月数function MonthsBetw date1 date2 date1和date2是2019 3 12格式 用 分成数组 date1 date1 split date2 date2 split 获取年 月数 var
  • 8086乘法指令MUL,IMUL

    对于加减指令来说CPU对有符号加减和无符号加减一视同仁 根据我们需要把它作为有符号的结果还是无符号的结果 但是乘除法指令区分有符号乘除和无符号乘除指令 无符号数乘法指令MUL MULtiply MUL OPRD OPRD可以用除立即数以外的
  • AD15设置覆铜与边框尺寸

    铺板铜边到的间距要比到其它的间距的优先级要高
  • 修改 placeholder 样式,placeholder 换行 以及iOS 上设置placeholder被遮挡

    修改placeholder样式 通过选择器就可以简单的修改该placeholder的样式 input placeholder font size 14px color 666666 placeholder 换行 在input 里面很少用到