input file 如何更改默认文字

1、打开编辑器，创建一个HTML文档，并且设立基本架构。

2、<form>

<input type="file">

</form>

我们引入input标签的时候，会发现浏览器会自动显示文字，这是默认的名字。

3、<input type="button" value="上传点这里" onclick="javascript:$('input[name=\'file\']').click();" />

        <input name="fileName" readonly />

        <input type="file" onchange="javascript:$('input[name=\'fileName\']').val(this.files[0].name);" />

我们这里实际可以另外创建一个button和file，利用js的功能。

但是这里就多了一个旧的功能了。

4、style="display: none;"

这个时候我们需要加入这个样式来取消掉旧的显示。

5、当然我们也可以用CSS来指定样式，这里新建一个CSS文档，并与HTML文档相关联。

6、<form class="main">

<input class="file" type="file">

<a href="#">上传图片</a>

</form>

.main{ 

    overflow:hidden; 

    position:absolute

}

.file{ 

    position:absolute; 

    z-index:200; 

    margin-left:-200px; 

    opacity:0;

    filter:alpha(opacity=0); 

    margin-top:-50px;

}

这里我们添加一个a链接，然后就可以依靠这个a链接来上次文件，主要要清除掉原来的文字。

7、a {

    text-decoration:none;

    border: 0.5px solid blue;

}

为了更接近原来的样式，我们可以修改一下a链接的样式。