- 浏览: 1093332 次
文章分类
- 全部博客 (379)
- S2SH (16)
- stuts2 (0)
- java语言 (81)
- JSP (17)
- <html>元素 (11)
- javaweb (4)
- web容器 (3)
- ext (23)
- javaScript (48)
- ant (1)
- liferay (1)
- sql (9)
- css (42)
- 浏览器设置 (3)
- office_world (1)
- eclipse (4)
- 其它 (28)
- 操作系统 (5)
- android (6)
- Struts2 (11)
- RegEx (3)
- mysql (5)
- BigDATA (1)
- Node.js (1)
- Algorithm (10)
- Apache Spark (1)
- 数据库 (5)
- linux (2)
- git (1)
- Adobe (3)
- java语言,WebSocket (1)
- Maven (3)
- SHELL (1)
- XML (2)
- 数学 (2)
- Python (2)
- Java_mysql (1)
- ReactJS (6)
- 养生 (4)
- Docker (1)
- Protocols (3)
- java8 (2)
- 书籍 (1)
- Gradle (2)
- AngularJS (5)
- SpringMVC (2)
- SOAP (1)
- BootstrapCSS (1)
- HTTP协议 (1)
- OAuth2 (1)
最新评论
-
Lixh1986:
Java并发编程:自己动手写一把可重入锁https://blo ...
Java之多线程之Lock与Condition -
Lixh1986:
http://win.51apps.com.cn/https: ...
temp -
ztwsl:
不错,支持很好
HttpServletRequest和ServletRequest的区别 -
guodongkai:
谢谢您能将知识精华汇编总结,让初学者们从原理中学会和提高。
javaScript之function定义 -
kangwen23:
谢谢了,顶顶
struts2中的ValueStack学习
@font-face 允许用户使用自定义的字体。在css中定义时,表示让浏览器下载指定的字体,并且显示。定义需要放在文件的开头。
字体文件有许多种格式。有的浏览器只支持某几种格式。
下面的定义,可以最大兼容浏览器支持:
然后就可以使用了:
-
https://css-tricks.com/snippets/css/using-font-face/
--
-
字体文件有许多种格式。有的浏览器只支持某几种格式。
下面的定义,可以最大兼容浏览器支持:
@font-face { font-family: 'MyWebFont'; src: url('webfont.eot'); /* IE9 Compat Modes */ src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('webfont.woff') format('woff'), /* Pretty Modern Browsers */ url('webfont.ttf') format('truetype'), /* Safari, Android, iOS */ url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */ }
然后就可以使用了:
body { font-family: 'MyWebFont', Fallback, sans-serif; }
-
https://css-tricks.com/snippets/css/using-font-face/
--
-
发表评论
-
Flex之 justify-content 和 flex-direction 的应用
2021-12-23 19:39 307flex 简介: 采用Flex布局的元素,被称为Flex容 ... -
CSS之页面元素飞入效果
2020-04-18 17:50 670效果预览: - https://www.runoob.com ... -
CSS之垂直居中
2020-04-02 10:00 345css里面用text-align:center ... -
Sass之&引用父选择器
2018-08-08 11:29 8245Sass之&引用父选择器 描述: 您可以使用&字符选 ... -
HTML5之canvas之粒子效果
2018-01-26 10:32 1437效果图: JavaScript 代码实现: & ... -
CSS之导航栏设计之 ul 之 li 标签排成一行
2019-06-04 11:11 2300在HTML页面元素设计中, 把具有相同一类功能的列表用 li ... -
HTML5/CSS3鼠标滑过图片滤镜动画效果
2017-12-21 10:54 1284HTML5/CSS3鼠标滑过图片滤镜动画效果 以前我们用CS ... -
CSS之提示框实现
2017-08-02 05:08 1934效果图: 注意以下要点: 1、提示框的箭头效果,且箭头 ... -
Responsive Web Design(自响应式网页设计)
2017-05-28 22:43 1202Responsive Web Design(自响 ... -
css 之 linear-gradient 之 进度条(progress bar)
2017-05-25 18:14 2125CSS 的 linear-gradient() 函数会创建 ... -
jQuery之mouseover,mouseover,mouseout,mouseleave
2017-03-14 10:20 625Jquery mouseenter() vs mouseove ... -
css:flex布局
2017-03-13 17:43 857A Complete Guide to Flexbox htt ... -
网站页面配色
2017-01-05 10:12 654导航栏,菜单栏 左侧菜单 导航,底部,选择列表 ... -
BootstrapCSS之Select
2016-10-18 17:00 1040效果图: 代码: <!-- Inclu ... -
CSS样式之带边框的 Anchor(超链接)
2016-10-08 15:19 2871效果图: HTML: <a c ... -
bootstrap css之响应式导航栏
2016-08-29 16:58 16720- 使用 Twitter Bootstrap 3 创建响应式导 ... -
CSS之 white-space : pre
2016-06-15 10:21 946在 github 的代码浏览页面,可以看到这样的 css 样式 ... -
CSS - li 元素显示在一行____ a 元素没有下横线
2016-05-27 20:44 2177原文链接: http://www.w3schools.com/ ... -
CSS - table 圆角 border radius
2016-04-29 12:08 4535效果: 代码: <!DOCTYPE htm ... -
[css - hr ] border color 横线高度和颜色
2016-04-28 10:59 3692如果设定 hr 的 border,会发现其高度会比不设置高2倍 ...
相关推荐
CSS3 @font-face实现个性化字体 制作页面的时候,我们常用“font-family ”来定义字体,然而我们用“font-family “定义的字体在用户的浏览器中是否可以呈现取决于用户的电脑上是否有安装我们定义的字体。在网络上...
icon图标通过@font-face实现,使用css3技术,更多图标请参考:http://kudakurage.com/ligature_symbols
@font-face是CSS3中有关于字体设置的属性,通过@font-face可以将本地字体设置为Web页面字体,并能兼容所有浏览器,使用这个属性就不必担心用户本地不具备这样的字体。因为我们把字体都上传到服务器上,不过这样一来...
NULL 博文链接:https://crabdave.iteye.com/blog/2343808
网页制作中,如果想使用特定的字体可以通过 @font-face 引用,即是解决访问用户电脑本地没有安装该字体导致不能按设计样式显示的问题。 注意: 支持 @font-face 的浏览器有Internet Explorer 9、Firefox Opera、...
通过@font-face能够加载服务器端的字体文件 font-family: "MOOC Font"; 表示该字体文件的引用,可以自定义 src: url("../other/niuniu_body.ttf"); 表示指定字体文件的路径 可以去...
在CSS3所有时髦的新功能中,很难说哪个最好。但是,假如非要找出 那么一个功能,一个现在就能用,而且能够令人浮想联翩的功能,我想 就要数Web字体了。
网页自定义字体CSS @font-face应用及制作.docx
@ font-face的是一个CSS规则,允许你输入自己的字体出现在网站上,即使在特定的字体在访问者的计算机上没有安装。这条规则最重要的是,它为设计师打开了一个全新的世界。您可以使用任何你喜欢的字体。 为什么它是真...
本文介绍了css3的属性@font-face的使用方法,以及在@fant-face中使用字体化图标,有相同需求的小伙伴,自己参考下。
https://blog.csdn.net/rookie_is_me/article/details/88394200字体文件资源
【真正的CSS3中文手册,不是CSS2的...圆角、多背景、@font-face 用户自定义字体、动画与渐变、渐变色、盒阴影、RGBa - 加入透明色、文字阴影等等。 CSS3 的出现,让代码更简洁、页面结构更合理,性能和效果得到兼顾。
响应式Web开发项目教程(HTML5+CSS3+Bootstrap)第2版 第2章 CSS3文本与图标 例2-2 @font-face用法
一、 font-face基本用法 font-face的基本用法想必大家都是知道的,基本上就是类似这样: @font-face { font-family: Lato; src: url('font-lato/lato-regular-webfont.woff2') format('woff2'), url('font-...
@font-face 是一个css2的一个语法,它允许你在网页上显示一个自定义的字体,下面为大家介绍下@font-face的基本用法,以及在所有浏览器都能使用的方法,感兴趣的朋友可以参考下哈,希望对大家有所帮助
NULL 博文链接:https://truth99.iteye.com/blog/1680652
...