【前端进阶01】利用@font-face定义并使用自己喜欢的字体

(1)效果说明

使用站酷高端黑字体。

(2)核心代码

@font-face{
	font-family: zcool;
	src:url('../font/zcool.ttf');
}
div{
	/*使用字体*/
	font-family: zcool;
}

(3)使用经验

——IE11、Chrome、Firefox、Safari、Opera支持ttf字体。IE6不支持ttf,但支持eot字体。

——如果写成如下样式,不行。后面的会覆盖前面的,即最后一个url引入的字体生效,所以如果想要做兼容,可能需要用if lt IE8做判断。

src:url('../font/zcool.eot'),url('../font/zcool.ttf');

——eotfast工具:把ttf字体转换成eot字体。

时间: 2024-11-05 20:59:52

【前端进阶01】利用@font-face定义并使用自己喜欢的字体的相关文章

Bootstrap开发前端 进阶(优化及与后端结合接口)总结

Bootstrap开发前端 进阶(优化与接口分析)           chang_jw 通过使用bootstrap3.3.7,html5, CSS3进行购票系统网站前端开发. 实现index,film. Cinema, certain,login, success页面并可形成关联性跳转逻辑. 一,使用Google Fonts 插件进行字体优化 文字是网页中很重要的组成部分.为文字选择一个合适的字体,能够更好的展现一个网站的个性,表达所要传递的信息. 对于font理解首先是从CSS中,如: 浏览

hdu3118Arbiter (利用二分图的定义,枚举每种状态)

Arbiter Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 131072/131072 K (Java/Others) Total Submission(s): 773 Accepted Submission(s): 401 Problem Description Arbiter is a kind of starship in the StarCraft science-fiction series. The Arbiter-cla

Web前端开发如何利用css样式来控制Html中的h1/h2/h3标签不换行

  H1/H2/H3/H4标题标签常常使用在一个网页中唯一标题.重要栏目.重要标题等情形下. H1在一个网页中最好只使用一次,如对一个网页唯一标题使用.H2.H3.H4标签则可以在一个网页中多次出现,但必要随意添加或添加过度. 在Web前端开发中,经常要使用H1标签对关键字进行优化,可是如果是一行文字中的某个词加上了H1标记,就会换行.可以使用下面的方法,H标签就不会强制换行了.Css控制为一行文字中某个字加上<h2>标签不换行,display:inline; 解释为:内联对象的默认值.用该值

前端进阶之路:点击事件绑定

网址:http://web.jobbole.com/83591/ 背景 我是一个前端小兵,我在一家互联网公司做做一些简单的业务开发. 某一天,我接到了一个需求,做一个抽奖功能.公司里的前辈们已经完成了业务逻辑,而且已经提供了业务功能的接口,只需要我制作页面并完成事件绑定即可. 我写好了页面,页面中有一个 ID 为 lucky-draw 的按钮元素.接下来,我需要为它绑定点击事件.我是这样写的: var btn = document.getElementById('lucky-draw') btn

web前端进阶突破瓶颈的前者经验

这里再说一下自己为什么会迷茫,技术学到某个阶段就很难提升了,更多只能靠自己摸索,没有人可以指导,就像是创业公司的CEO,突然想起之前的一家公司老板当时说的话,你看我现在好像是成功了,但是每天付出的却是你的10倍,你们只要把每天的工作完成就算合格了,要是再好一点就是优秀,但是我呢,没有人可以给我指导,更没有人给我方向,我工资是比你们高,但你们想想要是公司倒闭了,我就全没了,你们工资还是一样的,你付出的多少回报的就是多少,自然风险也更大. 在创业公司呆过以后让我懂得了创业并不是那么容易,扯歪了,回到

前端拾遗01

原本清明节出去浪的,怎奈何居然下雪了,没办法,在寝室仿个站(前端),来回顾一下前端知识吧 公共样式: /* common */ *{ margin: 0px; padding:0px; font-size: 15px; } ul{ list-style: none; } .left{ float: left; } .right{ float: right; } .center{ text-align: center; } .hide{ display: none; } .content-cent

利用Apperance协议定义View的全局外观

假设要定义一个全局的bkColor用于背景颜色 [email protected](nonatomic,strong)UIColor *bkColor UI_APPEARANCE_SELECTOR; 2.在下面方法中定义默认的背景颜色bkColr = redcolor; +(void)initialize{ [CustomView appearance].bkColor = [UIColor redColor]; } 3.在set方法里面设置backgroundColor: - (void)se

UI进阶--01

01-项目中常见的文件(LaunchScreen) Xcode5 框架是苹果事先已经导入进去的.在项目的结构当中就能够看到导入的框架. Xcode6 会自动导入一些觉见的框架.在项目结构当中,看不到已经导入的框架. LaunchScreen.xib:用来设置启动界面. Xcode7 会自动导入一些觉见的框架.在项目结构当中,看不到已经导入的框架. LaunchScreen.storyBoard LaunchScreen原理: 会自动加载LaunchScreen是因为在Target当中,指定了La

【转发】前端进阶篇之如何编写可维护可升级的代码

原文出处: 叶小钗(@欲苍穹)   欢迎分享原创到伯乐头条 前言 我还在携程的做业务的时候,每个看似简单的移动页面背后往往会隐藏5个以上的数据请求,其中最过复杂的当属机票与酒店的订单填写业务代码 这里先看看比较“简单”的机票代码: 然后看看稍微复杂的酒店业务逻辑: 机票一个页面的代码量达到了5000行代码,而酒店的代码竟然超过了8000行,这里还不包括模板(html)文件!!! 然后初略看了机票的代码,就该页面可能发生的接口请求有19个之多!!!而酒店的的交互DOM事件基本多到了令人发指的地步: