HTML5：使用@fontface，非系统字体的输入字段。这是否可行？

Question

快速问题，HTML5和CSS3中的表单输入字段是否可以使用非系统字体？因此，如果有人在表单字段中键入文本，文本可能是类似于Gotham的东西吗？

- pfunc

Answer 1

是的，这是可能的。我刚刚不得不从我应用它的网站中删除@font-face字体，否则我会为您提供一个可工作的示例。

以下是我在CSS中使用的内容：

@font-face {
    font-family: 'QuicksandBook';
    src: url('/media/fonts/Quicksand_Book.eot');
    src: local('Quicksand Book'), local('QuicksandBook-Regular'), url('/media/fonts/Quicksand_Book.ttf') format('truetype');
}

html, body,
input, textarea {
    font-family: QuicksandBook, Arial, sans-serif;
}

- digitaldreamer

Answer 2

这里没有什么特别的要做，只需像平常一样设置一个@font-face：

@font-face {
   font-family: "Delicious";
   src: url("Delicious-Bold.otf"); 
}

.myinput {
   font-family: "Delicious";
}  

在我的OSX Chrome上，这对我有效

- Bartek