<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title></title>
<style>
.file {
position: relative;
display: inline-block;
background: #D0EEFF;
border: 1px solid #99D3F5;
border-radius: 4px;
padding: 4px 12px;
overflow: hidden;
color: #1E88C7;
text-decoration: none;
text-indent: 0;
line-height: 20px;
}
.file input {
position: absolute;
font-size: 100px;
right: 0;
top: 0;
opacity: 0;
}
.file:hover {
background: #AADFFD;
border-color: #78C3F3;
color: #004974;
text-decoration: none;
}
</style>
</head>
<body>
<a href="javascript:void(0);" class="file">选择文件
<input type="file">
</a>
</body>
</html>

<input type='file'/>把默认样式改成框框的更多相关文章

  1. 修改input type=file 标签默认样式的简单方法

    <html><head><title></title></head><body><form id="upload ...

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

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

  3. 去掉input type=file的默认样式

    原样式: 解决: 加style="opacity: 0;"变成透明的 然后可以外面套个div,在div上自定义样式.

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

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

  5. 修改 input[type="radio"] 和 input[type="checkbox"] 的默认样式

    表单中,经常会使用到单选按钮和复选框,但是,input[type="radio"] 和 input[type="checkbox"] 的默认样式在不同的浏览器或 ...

  6. 利用CSS 修改input=radio的默认样式(改成选择框)

    html部分: <input id="item2" type="radio" name="item"> <label fo ...

  7. 清除input[type=number]的默认样式

    input[type=number] { -moz-appearance:textfield; } input[type=number]::-webkit-inner-spin-button, inp ...

  8. 去除input[type=number]的默认样式

    input[type=number] { -moz-appearance: textfield; } input[type=number]::-webkit-inner-spin-button, in ...

  9. 去掉input[type="number"]的默认样式

    input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{ -webkit-appearance: none !importa ...

随机推荐

  1. 骑士游历/knight tour - visual basic 解决

    在visual baisc 6 how to program 中文版第七章的练习题上看到了这个问题,骑士游历的问题. 在8x8的国际象棋的棋盘上,骑士(走法:一个方向走两格,另一个方向一格)不重复走完 ...

  2. Server-Sent Events（HTML5 服务器发送事件）

    Server-Sent Events简介 Server-Sent Events(SSE)用于网页自动获取服务器上更新的数据,它是一个实时性的机制. 实时性获取数据的解决方案 对于某些需要实时更新的数据 ...

  3. iOS - + initialize 与 +load

    一.+ initialize 方法和+load 调用时机 首先说一下 + initialize 方法:苹果官方对这个方法有这样的一段描述:这个方法会在 第一次初始化这个类之前 被调用,我们用它来初始化 ...

  4. sprint2总结

    在sprint第二阶段的学习过程中,前期和后期在学校网络的支持下我们成功的延迟了把代码上传github的时间,在我们自己感觉上看,完成项目的质量比较理想,在经过sprint第一阶段的学习后,部分上的问 ...

  5. 使用Qt5.7.0 VS2015版本生成兼容XP的可执行程序 good（从VS2012 update1开始支持xp和c++11）

    一.直接使用VS2012/VS2013/VS2015生成XP兼容的可执行程序 Visual Studio刚发布时没打补丁,称为RTM版,之后会陆续发布补丁,进行bug修复和功能增强.VS2010及之前 ...

  6. 视觉机器学习读书笔记--------SVM方法

    SVM是一种二类分类模型,有监督的统计学习方法,能够最小化经验误差和最大化几何边缘,被称为最大间隔分类器,可用于分类和回归分析.支持向量机的学习策略就是间隔最大化,可形式化为一个求解凸二次规划的问题, ...

  7. VS2013 GIT 克隆远程仓库

    1.配置本地GIT 工具->选项->源代码管理,选择GIT 2.打开团队资源管理器,找到GIT克隆选项 3.单击克隆,在输入框内输入远程仓库地址,然后单击克隆即可 GIT 插件配置:参考  ...

  8. 指定的架构无效。错误: CLR 类型到 EDM 类型的映射不明确

    在使用WebService开发时,同时使用了EF和linq,查询数据时,使用linq(查询订单)可以正常拉出数据, 但是使用EF(查询用户)却会报以下错误: {"指定的架构无效.错误: \r ...

  9. css控制段落

    <p></p>标签:一段话或者段落适宜于用p标签: 段落缩进:text-indent:50px: 文字方向:text-align:center居中.left往左显示.right ...

  10. 配置 Docker 加速器（Docker Hub Mirror）

    Docker 加速器是什么,我需要使用吗? 使用 Docker 的时候,需要经常从官方获取镜像,但是由于显而易见的网络原因,拉取镜像的过程非常耗时,严重影响使用 Docker 的体验.因此 DaoCl ...