在工作中时常会遇到如需要上传功能的按钮，而不像需要系统默认的样式时候，可以采取以下的解决方案：

<img onclick="getElementById('file').click()" style="cursor:pointer;" title="点击添加图片" alt="点击添加图片" src="sc.png"><!--用来替换按钮的图片
-->
 <input type="file" multiple="multiple" id="file" name='file' style="height:0;width:0;z-index: -1; position: absolute;left: 10px;top: 5px;"/><!--原来按钮的样式-->

便可轻松的解决问题

关于去除input type='file'改变组件的默认样式换成自己需要的样式的解决方案的更多相关文章

  1. html中input type=file 改变样式

    <style> #uploadImg{ font-size:12px; overflow:hidden; position:absolute} #file{ position:absolu ...

  2. 谷歌游览器对<input type='file'> change只能响应1次解决和样式的改变

    在项目过程中遇到的需要上传本地文件,file的原始控件不太美观,但是这个控件和button有点不太一样, 改变这个样式的思路就是在控件外面套一层链接,然后把file控件的透明度设置为0(透明).样式只 ...

  3. vuetify | vue | 文件上传组件 | file | upload | form input[type="file"]

    今天无聊地写vuecli3听歌的时候,遇到了上传文件到Django的自我需求,然后就到vuetify的表单组件里找upload btn,发现居然没有!!! 顿时惊了个呆,要知道之前用element做操 ...

  4. 改变input type="file" 文字、样式等

    <div class="tac"> <input type="file" id="browsefile" class=&q ...

  5. html的文件控件<input type="file">样式的改变

    一直以来,<input type="file">上传文件标签默认样式都是让人不爽的,使用它多要给它整整容什么的,当然如果用ui插件还比较方便,不能就自己来操刀实践一下! ...

  6. 原来样式改变不了（input type="file"）

    label { background-color: #979fa8; color: #fff; display: inline-block; padding: .8rem 4rem; cursor: ...

  7. 改变input[type=file]的默认样式

    自定义上传按钮样式的终极解决方案--input透明法 <style> .div1{ float: left; height: 41px; background: #f5696c; widt ...

  8. html中，文件上传时使用的<input type="file">的样式自定义

    Web页面中,在需要上传文件时基本都会用到<input type="file">元素,它的默认样式: chrome下: IE下: 不管是上面哪种,样式都比较简单,和很多 ...

  9. 用jQuery重置用于文件上传的input (type="file")

    页面中有如下标签: <input type="file" id="upload"/> 此标签本用于文件上传,现在有需要将其值重置为空.于是想当然地写 ...

随机推荐

  1. Scope and Namespace

    Python基础-作用域和命名空间(Scope and Namespace) 在Python中,对象是独立的,不同作用域中的不同名字都可以被绑定在同一个对象上,当然对这个对象的修改会影响所有的引用.赋 ...

  2. jQuery Validation让验证变得如此容易(一)

    一.官网下载jquery,和jquery validation plugin http://jqueryvalidation.org/ 二.引入文件 <script src="js/j ...

  3. 三.redis 排序

    本篇文章介绍下redis排序命令.redis支持对list,set和sorted set元素的排序.排序命令是sort 完整的命令格式如下: SORT key [BY pattern] [LIMIT ...

  4. service structure flowchart with full stack functionality in a brife map

    More functionality will be added and running This diagram is just an easy chart for people to digest

  5. java动态加载配置文件

    最近项目中需要做定时任务,即定时数据库的备份.定时时间用户可以在界面中配置,要求配置修改好立即生效. 想不到什么好办法.下面是一种实现思路 把用户配置的时间存到properties配置文件中,定时任务 ...

  6. TCMalloc小记

    周末抽空看了一下tcmalloc,了解了个大概.下面记录一下. 一. 原理 tcmalloc就是一个内存分配器,管理堆内存,主要影响malloc和free,用于降低频繁分配.释放内存造成的性能损耗,并 ...

  7. Redis监控数据分布工具Redis-audit 使用总结

    Redis-audit 是一个用ruby实现的脚本,通过它,我们可以知道每一类 key 对内存的使用量.它可以提供的数据有:某一类 key 值的访问频率如何,有多少值设置了过期时间,某一类 key 值 ...

  8. java 逆波兰表达式

    最近想把这破机 装成WIN7 想想还是算了 ...  反正用的机会也不多. 不过 发现了一些 想念的东西 从前的作业. 从前的记忆. package org.lmz; import java.util ...

  9. Create Table DDL sample(TSQL)

    IF EXISTS (SELECT 1 FROM sysobjects o, sysusers u WHERE o.uid=u.uid AND o.name = 'Table_Name' AND u. ...

  10. NodeJS Stream 二：什么是 Stream

    对于大部分有后端经验的的同学来说 Stream 对象是个再合理而常见的对象,但对于前端同学 Stream 并不是那么理所当然,github 上甚至有一篇 9000 多 Star 的文章介绍到底什么是 ...