修改 上传图片按钮input-file样式。。
2013-09-25 13:57
513 查看
<!doctype html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .filebox {width:100px;height:40px;display:inline-block;zoom:1;position:relative;} .filebox .file {width:100%;height:120%;position:absolute;top:-9%;left:-10%;opacity:0;filter:alpha(opacity:0);font-size:130%;cursor:pointer;} .filebox .btn {width:100%;height:40px;display:block;border:none;background-color:#f30;color:#fff;text-align:center;line-height:40px;font-size:14px;font-weight:bold;} .filebox:hover .btn {background-color:#f60;} </style> </head> <body> <a class="filebox"> <input type="file" name="" id="" class="file" /> <input class="btn" type="button" value="选择图片"/> </a> 这个是文字 </body> </html>
相关文章推荐
- CSS圆角表格效果
- 有利于SEO的DIV+CSS的命名规则
- CSS布局左中右宽度固定高度自动
- css3 渐变用法
- CSS之float和clear的区别
- 基于文档流解读html元素的(css)定位形式
- Flex项目中css无法引用flex库项目中的图片资源
- 设置字体和文本样式
- ready函数,css函数,text(),insertAfter()
- CSS 文本框里添加按钮的实现
- css3 中background的新增加的属性的用法(一)
- CSS3之文字阴影text-shadow
- 使用PHP下载CSS文件中的图片的代码
- Css样式详解--框模型
- CSS基础(一):开篇
- CSS+DIV实现文字一行内显示,并且过多的文字以点来代替
- (3)选择元素——(5)为项目列表加样式(Styling list-item levels)
- 兼容不同浏览器的 CSS Hack 写法
- 用CSS3实现对图片的放大效果
- display:none与visible:hidden的区别