html – 在文本输入区域内添加位置标记glypphicon
发布时间:2020-12-14 16:43:55 所属栏目:资源 来源:网络整理
导读:我使用bootstrap并尝试在文本输入元素中添加位置glyphicon标记 我尝试将glypicon类添加到输入区域,如下所示: input type="text" class="form-control glyphicon glyphicon-map-marker" 我在W3Schools上使用了botostrap glyphicons的示例,该示例包括 span内
我使用bootstrap并尝试在文本输入元素中添加位置glyphicon标记
我尝试将glypicon类添加到输入区域,如下所示: <input type="text" class="form-control glyphicon glyphicon-map-marker" > 我在W3Schools上使用了botostrap glyphicons的示例,该示例包括< span>内的glyphicon标记.元素不在`元素内,所以我相信我的问题所在的os. IM试图实现以下外观: The example website where I got the image from在其css中使用位置标记作为背景图像… background-image: url(data:image/png;base64); 关于如何解决这个问题的任何建议,非常感谢. 解决方法
您可以尝试在字段内实施
this Font Awesome图标 –
here’s相关问题将帮助您实现所需结果.
.wrapper input[type="text"] { position: relative; } input { font-family: 'FontAwesome'; } /* This is for the placeholder */ .wrapper:before { font-family: 'FontAwesome'; color:red; position: relative; left: -5px; content: "f041"; } <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.css" integrity="sha256-uXf0U0UCIqBp2J3S53b28h+fpC9uFcA8f+b/NNmiwVk=" crossorigin="anonymous" /> <p class="wrapper"><input placeholder=" Username"></p> (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |