如何将input type=file显示的浏览为自定义

 我来答
育知同创教育
2016-08-10 · 百度知道合伙人官方认证企业
育知同创教育
1【专注:Python+人工智能|Java大数据|HTML5培训】 2【免费提供名师直播课堂、公开课及视频教程】 3【地址:北京市昌平区三旗百汇物美大卖场2层,微信公众号:yuzhitc】
向TA提问
展开全部

将input type=file显示的浏览为自定义的方法是:
1、定义一个装载file的form:

<label for="upload-photo">Browse...</label>
<input type="file" name="photo" id="upload-photo" />

2、自定义css样式:

label {
  pointer: cursor;
  /* Style as you please, it will become the visible UI component. */
}
#upload-photo {
  opacity: 0;
  position: absolute;
  z-index: -1;
}

3、完整代码及结果如下:

<!DOCTYPE html>

<html>

<head>

<style> 

label {

  pointer: cursor;

  /* Style as you please, it will become the visible UI component. */

}

#upload-photo {

  opacity: 0;

  position: absolute;

  z-index: -1;

}

</style>

</head>

<body>

<label for="upload-photo">Browse...</label>

<input type="file" name="photo" id="upload-photo" />

</body>

</html>

推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式