问题:

   根据需要,给input添加背景图片,又需要点击input及input的这个背景触发事件,但是给input输入内容多时,会覆盖此背景(如下图),

   图中,java人员使用插件省市区三级联动,需要input, 同时还要给input做三角下拉按钮背景(整个截取如德邦,或只截取至右),但是当地

   名长的时候,会覆盖这个背景.

解决:(很简单却没想起来)

   给input做padding-right:24px;即可解决.

  

注意:

  input的文本内容自带左右翻看

   input select 等好像z-index比较高

欢迎指正

给inpu加背景图,input内容又不能盖着背景图的更多相关文章

  1. 去除input默认带的上下按钮与修改placeholder的默认颜色、背景、placeholder内容的大小

    有时候需要用input元素中type属性值为number时,会出现默认的上下按钮, 去掉input默认的上下按钮:兼容性写法如下 input[type='number']::-webkit-outer ...

  2. css 背景透明文字(内容)不透明三种实现方法

    好久没写博客了.以前还想着最少一个月抽空写几篇.结果没做到O(∩_∩)O~~.好吧.现在努力,继续坚持. 看着以前写的东西,感觉自己在逐渐成长. 先上图: 本文主要记录如上图一样的.文字或内容不透明, ...

  3. 一个解决chrome浏览器下input标签当autocomplete的时候背景变黄色同时input背景图片消失方案

    最近在改一个bug即如标题所讲的一样,chrome浏览器下当input标签开启autocomplete的时候input的背景颜色变黄同时在input的背景图片也被覆盖了.为此百度了好久发现网上说的使用 ...

  4. phpcms_v9 多图字段 内容页,首页,分页自定义字段调用

    phpcms_v9 多图字段 内容页,首页,分页自定义字段调用 说明:自定义多图字段名 shigongtu 1 内容页调用 {loop $shigongtu $r}      <img src= ...

  5. 使用disavled属性锁定input内容不可以修改后,打印获取不到对应的值

    当我们需要锁定input内容不让修改时,可以使用disabled="disabled"和readonly="readonly", 官方的解释是:disabled ...

  6. 取消chrome浏览器下input和textarea的默认样式;html5默认input内容清除“×”按钮去除办法

    取消chrome浏览器下input和textarea的默认样式: outline:none;/*清空chrome中input的外边框*/ html5默认input内容清除“×”按钮去除办法: inpu ...

  7. bootstrap模态框modal使用remote第二次加载显示相同内容解决办法

    bootstrap模态框modal使用remote动态加载内容,第二次加载显示相同内容解决办法 bootstrap的modal中,使用remote可以动态加载页面到modal-body中,并弹窗显示 ...

  8. 时时监听input内容的改变

    心得:我们都知道input有一个change事件,但是是在input元素失去焦点的时候发生,不能时时的监听input内容的改变. 刚开始的时候我是想用setInterval设置计时器的原理定时监听in ...

  9. 如何修改PDF文件内容,PDF怎么添加背景

    很多的情况下,大家都会遇到PDF文件,不管是在学习中还是在工作中,对于PDF文件,文件的修改编辑是需要用到PDF编辑软件的,在编辑文件的时候,发现文件的页面是有背景颜色的,又该如何修改背景颜色呢,不会 ...

随机推荐

  1. VC++ CString类完美总结(整理)

    CString 是编程中一种非常有用的数据类型,它是MFC中的一个类,很大程度上简化了MFC中的许多字符串的操作. CString位于头文件afx.h中. ①.CString 类对象的初始化: CSt ...

  2. 前端 js 发送验证码

    1. 代码如下: <html> <head> <meta charset="utf-8"> <title></title> ...

  3. git mac客户端使用提交与同步

    点击file -> add local  repository 将本地已经存在的git库添加到客户端中 当项目有改变时,点击正上方居中的Uncommitted Change按钮查看改变的内容 在 ...

  4. Java GridBagLayout 简单使用

    这里只介绍了很基础布局构建及使用,主要是关于 GridBagLayout. 首先整套流程大概是, 声明一个 GridBagLayout 对象 private GridBagLayout gridBag ...

  5. Swift - 生成随机颜色(Extension UIColor)

    在开发中,我们有时需要生成一些随机的颜色.但 UIColor 没有提供方法或属性来直接获取随机颜色,这里对其进行扩展,方便使用. 1,扩展UIColor,增加随机颜色属性 1 2 3 4 5 6 7 ...

  6. Smooth Mouse

    一款免费软件,使mac可以做到和 Windows 下的鼠标加速度的相同算法,实现同样 win 的鼠标操控感,也可以实现鼠标0加速度.

  7. 基于requests实现极客学院课程爬虫

    背景 本文主要是为了完成极客学院课程<Python 单线程爬虫>中讲师布置的实战作业. 开发环境 操作系统:windows 10 Python :Python 2.7 IDE:PyChar ...

  8. 搭建eclipse+github开发环境

    开发环境 1.jdk:jdk1.8.0_60 2.eclipse:eclipse-jee-mars-R-win32-x86_64.zip 配置步骤 1.配置本地git目录(可选) eclipse-je ...

  9. [leetcode] 题型整理之动态规划

    动态规划属于技巧性比较强的题目,如果看到过原题的话,对解题很有帮助 55. Jump Game Given an array of non-negative integers, you are ini ...

  10. 自定义ActionBar完全覆盖系统的

    //加载ActionBar的方法 @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this ...