【发布时间】：2019-01-10 03:46:24
【问题描述】：
我正在尝试使丑陋的文件上传按钮看起来像一个漂亮的字体真棒图标。
这是我目前所拥有的：
<div class="col-12 col-md-4">
<button type="button" class="btn btn-round mt-0 mb-0 uploadMediaTrigger" data-toggle="modal" data-target="#uploadMedia" rel="tooltip" data-placement="top" title="Upload Media">
<i class="far fa-images"></i>
</button>
{{ form_widget(postForm.file, { 'attr': {'class': 'far fa-images'} } ) }}
</div>
你知道我怎样才能让丑陋的按钮看起来像字体真棒图标吗？似乎仅仅添加字体真棒类是行不通的。
这是一张图片：
【问题讨论】：
-
您可以使用
form_widget并在Twig 中设置自定义类（如果您在多个地方使用该表单），或者您可以访问postForm.file.vars.*并创建您的自定义HTML。使用{{ dump(variable) }}看看你可以使用什么。 -
隐藏
<input type="file"并通过 css 将标签设置为您的图标。所以稍后会触发对标签的点击，而不是点击输入。 -
您好 Fabian，我必须添加标签，然后向标签添加点击事件吗？
-
没有点击会自动为您处理每个浏览器:) 阅读这篇关于它的简短文章tympanus.net/codrops/2015/09/15/… 或看看这个jsfiddle.net/4cwpLvae
标签： css forms symfony fonts widget