我已经看到一些新的网站在他们的网站上使用自定义字体(除了常规的Arial,Tahoma等).

而且它们支持大量的浏览器.

怎么才能做到这一点呢?同时如果可能,还阻止人们免费访问下载该字体.

推荐答案

通常,您可以在CSS中使用@font-face的自定义字体.这里有一个非常基本的例子:

@font-face {
    font-family: 'YourFontName'; /*a name to be used later*/
    src: url('http://domain.com/fonts/font.ttf'); /*URL to font*/
}

然后,简单地在特定元素上使用字体:

.classname {
    font-family: 'YourFontName';
}

(.classname是您的 Select 符).

请注意,某些字体格式并不适用于所有浏览器;你可以使用fontsquirrel.com的生成器来避免太多的转换工作.

你可以找到由Google Fonts提供的一套不错的免费网络字体(也有自动生成的CSS @font-face规则,所以你不需要自己写).

同时,如果可能的话,也会阻止人们免费下载字体

不,不可能通过CSS嵌入自定义字体来设置文本样式,同时阻止人们下载.你需要使用图像、Flash或HTML5 Canvas,所有这些都不是很实用.

我希望这有帮助!

Css相关问答推荐

NextJs - Tailwind css类样式未应用于响应屏幕

如何以Angular 将下拉面板的宽度与其文本框对齐

创建始终为剪辑元素的300%高度并左对齐的圆形剪辑路径

SVG文本在移动浏览器上增长并溢出

如何为多个背景和棋盘设置不同的大小

当滚动量较小时,在滚动问题上动画粘性导航

为什么 width: 100% 在 Flex 父级中缩小这个 div ?

同时实现渐变文本和闪光文本效果是否可行?

Angular Material - 将 matsnackbar 置于所有对话框之上

如何按列垂直对齐项目,但不在列内水平对齐

如何在悬停另一个部分的元素时使元素可见?

无法使用 Bootstrap 3 更改占位符 colored颜色

为什么 .class:last-of-type 不能按我的预期工作?

输入/按钮元素不会在 flex 容器中缩小

Angular 5 在某些类中添加了ng-star-inserted - 那是什么?

空的 iframe src 是否有效?

矩形图像的 CSS 圆形裁剪

使用 :focus 设置外部 div 的样式?

你如何在 SASS 中定义属性 Select 器?

为什么 height:0 不隐藏我的填充