html如何导入字体样式表,导入html字体及其样式变体?

news/2025/2/12 12:56:54/

我在我的网站中实施名为Roboto的谷歌字体。导入html字体及其样式变体?

我需要2种类型:bold和regular。

thcUF.jpg

所以我检查两种类型,并按下下载按钮:

NxcOC.jpg

但在下载的RAR文件我得到了所有的字体样式(也者,我没有选择):

JkyTm.jpg

无论如何,我想考经常字体:(字体现在在我的网站,并没有从谷歌加载)。

(我使用字体转换器(http://www.font2web.com/)的其他扩展类型(EOT,WOFF,SVG))

所以我做:

@font-face {

font-family: 'Roboto';

src: url('/font-face/Regular/Roboto-Regular.eot'); /* IE9 Compat Modes */

src: url('/font-face/Regular/Roboto-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */

url('/font-face/Regular/Roboto-Regular.woff') format('woff'), /* Modern Browsers */

url('/font-face/Regular/Roboto-Regular.ttf') format('truetype'), /* Safari, Android, iOS */

url('/font-face/Regular/Roboto-Regularo.svg#svgFontName') format('svg'); /* Legacy iOS */

}

body { font-family: 'Roboto', sans-serif; }

问:

假设我想将Roboto bold样式应用于div。

我应该做这样的:

div {

font-family: 'Roboto', sans-serif;

font-weight:bold

}

或应该怎么做这个(从头再来......)

@font-face {

font-family: 'Roboto-bold';

src: url('/font-face/Regular/Roboto-bold.eot'); /* IE9 Compat Modes */

...

}

然后

div { font-family: 'Roboto-bold', sans-serif; }


http://www.ppmy.cn/news/836441.html

相关文章

Ai 缺失字体解决方法

Ai 缺失字体解决方法 今天用Ai 打开Matlab 的eps 图片提示缺失字体,解决方法如下: 本文教你如何在Windows电脑上向Illustrator中添加字体。 安装字体 对于不是 Matlab 系统自带的字体 如 helvetica-font-family 这里下载.下载后点击右键’为所有用户安装’. Helvetica font…

css自定义字体(@font-face的使用)

首先获取需要使用字体文件,此处以LetsgoDigitalRegular.ttf为例: 新建一个css文件,代码: font-face {font-family:LetsgoDigitalRegular;src: url(../font/LetsgoDigitalRegular.ttf); } 当然也可以定义标签支持的其他属性&…

html5 字体嵌入,网页中嵌入特殊字体(@font-face)

这里主要用到font-face这个语法。 假如我要使用一个open-sans字体,点击ADD FONTS按钮,并勾选Agreement,如下图 打开转换字体的网站http://www.fontsquirrel.com/tools/webfont-generator 上传后,会自动生成所需eot,svg…

前端项目引入字体

前端项目引入字体 我的一个uni-app项目,需要引入PingFangSC-Regula字体,也就是PingFang-SC-Regular字体。 1.pingfang-sc-regular字体下载 网上去搜查,我下载的 2.pingfang-sc-regular字体转换 网上下载的只有tff格式,为了兼容…

设置字体格式,加粗,regular,light

设置文字大小和字体的途径有两个: 第一种,直接使用xib设置 , , 第二种,使用代码 Label.font [UIFont fontWithName:"Helvetica-bold" size:15.f];//加粗 Label.font [UIFont fontWithName:"Helvet…

7、前端开发:CSS知识总结——字体样式

目录 一、长度单位 二、颜色单位: 三、设置字体颜色 四、在网页中将字体分成5大类: 五、设置文字大小 一、长度单位 1:像素 px 实际上是屏幕上的一个个小点,100px,100个小点,这个点,正常情况我们是看不到…

html怎么加载入其他字体,css如何引入外部字体文件?

在网站页面中有时我们需要有一个好看的字体,毕竟好看的字体会让整个页面看起来更加美观也更吸引用户,下面给大家来介绍一下css外部字体引入的方法。 我们引入css外部字体需要利用的是css3的font-face,font-face是什么呢?下面我们来…

vue项目引入外部字体

文章目录 一、vue项目引入外部字体1.网上下载字体包2.在项目中引入字体3.然后在css文件夹 创建一个font.css文件,文件用于声明引入的字体,定义字体名称4.在main.js中引入font.css文件5.在css中使用 一、vue项目引入外部字体 1.网上下载字体包 2.在项目中…