Question

我认为这很容易，但很明显，这需要比我更聪明的人。我的项目作为特殊货币符号而不是$。我们一直将它用作一个微小的图像并用<img>嵌入它。但是，不能在<input>字段中使用它。特别想让它成为type = submit <input>字段中按钮文本的一部分。

我已经阅读了很多内容，但没有理解这样做有什么意义。我使用Windows私有字符编辑器创建了一个私有角色，但我需要一种方法让html在<input>字段中为我渲染。

我正在阅读<glyph-data＆gt;还有图标字体。我有这种感觉（只是一种感觉），图标字体可能会为我做这件事，但它似乎是一个时间投入完成它。

任何人都可以提出一个有意义的方法吗？

Answer 1

您可以使用按钮中的图像或图标，这是一个很好的示例 - playground snippet

Answer 2

创建一个特殊字符只不过是创建一个徽标或类似的东西。您需要将此符号导出为SVG，并将其用作嵌入式SVG或图标字体（我建议http://fontello.com/）。

此外，请注意，如果您只想在按钮中使用它，则可以使用<button>标记，如下所示：

<button type="submit"><img src="your/image.png" alt="currency"></button>

它会像input[type="submit"]一样工作。

Answer 3

已经存在常见的currency sign：¤（¤或¤）。我建议以SVG格式获取所需的“私有图像”，访问IcoMoon Web应用程序，将其上传到那里，生成webfont，同时指定相应的字符点00a4。通过这种方式，您可以使用您遗嘱的另一种形式向后兼容代表共同货币符号。

Answer 4

您可以设置按钮的背景图像（或任何输入字段）。

#submitButton {
  background-image: url('/link/to/image');
  background-position: left center;
  padding-left: 12px; /* or whatever your image width is */
}

上面的CSS假设您在提交按钮

中添加了其他文本

<input type="submit" id="submitButton" value="Some text"/>

如果您没有放置任何文字并且只想使用图片，则只需将背景位置设置为居中中心并删除填充左侧

想要在输入字段中使用特殊的私人字符

4 个答案: