web -前端历程
来源:互联网 发布:如何避免社交网络 编辑:程序博客网 时间:2024/05/20 01:44
前端历程 1:对于前端中自定义字体的兴趣
http://www.w3cplus.com/content/css3-font-face
今天突发奇想,为什么不能自定义自己的字体(font)呢?天天用那些自定义好的很丑哎~~所以找到一位大神的阐述内容。
大体上来说,@font-face的引用是这个问题的解决入口
1.下载你所感兴趣的字体形式
http://webfonts.fonts.com/
http://typekit.com/
http://kernest.com/
http://kernest.com/licenses
http://www.dafont.com/
http://nicewebtype.com/fonts/
2.接下来就是引用到整体的代码的问题了,,这下就来到了@font-face来了
@font-face { font-family: 'YourWebFontName'; src: url('YourWebFontName.eot?') format('eot');/*IE*/ src:url('YourWebFontName.woff') format('woff'), url('YourWebFontName.ttf') format('truetype');/*non-IE*/ }
这个是@font-face的格式
实例一下吧
@font-face { font-family: 'YourWebFontName'; src: url('YourWebFontName.eot'); /* IE9 Compat Modes */ src: url('YourWebFontName.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('YourWebFontName.woff') format('woff'), /* Modern Browsers */ url('YourWebFontName.ttf') format('truetype'), /* Safari, Android, iOS */ url('YourWebFontName.svg#YourWebFontName') format('svg'); /* Legacy iOS */ }
唉,这时候问题来了,这些个文件后缀 .eot .ttf是怎么来的呢??好,刚才我们已经得到字体的文件了,然后上传到http://www.fontsquirrel.com/fontface/generator这个网址上生成对应的文件然后导入到你的项目中就大功告成了
0 0
- web -前端历程
- web前端的学习历程
- web-前端历程(2)浮动与清除浮动
- 前端学习历程1
- 前端模块化发展历程
- 前端学习历程
- 菜鸟前端101历程 #002
- 菜鸟前端101历程 #004
- 我的前端学习历程
- 我的前端历程开端
- 前端猿的成长历程
- 新手一个月前端历程
- 前端开发工程师学习历程
- 我的前端学习历程
- 前端javascript的学习历程
- 浅谈前端的学习历程
- 记录自学前端的历程
- Moblie Web历程
- Collectd & InfluxDb & Grafana 之一: 常用系统统计
- nodejs curl 输出内容
- 使用微信公众号进行发红包
- AlarmManager 闹钟(全局定时器)
- 常用MD5工具类
- web -前端历程
- 【Unity】Android平台的代码热更新
- 30个你不可不知的css选择器
- EOJ 1162 tom and jerry bfs
- 欢迎使用CSDN-markdown编辑器
- hackinglab.cn脚本关之四
- 3.用户及文件权限管理
- Timer小记
- 对android中ActionBar中的几种设置说明