HTML5之字体
- 使用CSS样式来定义
context.font = [CSS font property]
context.font = [font-style font-variant font-weight font-size font-family ]
属性名:font-style/font-variant/font-weight/font-size/font-family
只有font-size和font-family是必须的
如果指定的字体找不到会使用默认的字体
可以指定网络路径字体 @font-face{fontfamily:Scriptina;src:url('fonts/scriptina.ttf');}
--- 水平对齐方式
- textAlign属性用于判断水平对齐方式
context.textAlign = [left|right|center|*start|end]
- 修改浏览器字体排列方向
document.dir = [*|tr|rtl]
--- 垂直对齐方式
- textBaseline 指定垂直对齐方式
context.textBaseline = [top|middle|*alphabetic|bottom|hanging|ideographic]
--- 绘制文字
- 类似于绘制图形,首先fill然后stroke
context.fillText(text,x,y,maxwidth)
context.strokeText(text,x,y,maxwidth)
- 测量文字宽度
TextWidth = context.measureText(text).width
HTML5之字体的更多相关文章
- html5——web字体
基本介绍 1.自定义网页特殊字体,无需考虑用户电脑上是否安装了此特殊字体,从此把特殊字体处理成图片的时代便成为了过去. 2.支持程度比较好,甚至IE低版本浏览器也能支持. 3.web字体的大小鉴定是字 ...
- HTML5移动Web开发(八)——避免文本字体大小重置
适用设备:iOS.Windows Mobile在一些移动设备上,比方说iPhone,Windows Mobile,当用户把手机切换到横屏时,浏览器会自动地重置文本字体大小.这可能会对我们造成困扰,因为 ...
- Monotype推出基于HTML5的Web字体平台
著名字体公司Monotype近日宣布推出基于HTML5的Web字体平台,设计者可以访问近10万字体的目录. Monotype推出基于HTML5的Web字体平台 Monotype推出基于HTML5的We ...
- HTML5做手机站页面字体显示很小的解决方法
HTML5做手机站需要加上一部分代码,不然字体会显示很小的,经历了很久的不解才发现的,希望给大家一些帮助 <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD ...
- 解决html5 canvas 绘制字体、图片与图形模糊问题
html5 canvas 绘制字体.图片与图形模糊问题 发生情况 多出现在高dpi设备,这意味着每平方英寸有更多的像素,如手机,平板电脑.当然很多高端台式电脑也有高分辨率高dpi的显示器. canva ...
- 01_MUI之Boilerplate中:HTML5示例,动态组件,自定义字体示例,自定义字体示例,图标字体示例
1安装HBuilder5.0.0,安装后的界面截图如下: 2 按照https://www.muicss.com/docs/v1/css-js/boilerplate-html中的说明,创建上图的 ...
- html5移动端页面分辨率设置及相应字体大小设置的靠谱使用方式
对于html5移动端网页编写CSS网上有很多介绍的文章,但在实际使用过程中还是会纠结. 网上的资料太多,且大多都是技术介绍型,特别是针对android上,网上写的各种麻烦,各种复杂,各种不接地气儿.. ...
- html5 canvas在线文本第二步设置(字体边框)等我全部写完,我会写在页面底部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 01_MUI之Boilerplate中:HTML5演示样例,动态组件,自己定义字体演示样例,自己定义字体演示样例,图标字体演示样例
1安装HBuilder5.0.0,安装后的界面截图例如以下: 2 依照https://www.muicss.com/docs/v1/css-js/boilerplate-html中的说明,创建上 ...
随机推荐
- 让Visual Studio 2015 支持ASP.NET MVC4.0.0.1
近日装上了Visual Studio 2015 ,打开之前vs2013创建的MVC4的项目发现无法编译通过,提示System.Web.MVC,System.Web.WebPages 等找不到,网上搜索 ...
- centos6下安装部署hadoop2.2
环境准备1.操作系统:centos6.0 64位2.hadoop版本:hahadoop-2.2.0 安装和配置步骤具体如下:1.主机和ip分配如下 ip地址 ...
- 关于写blog这件事
事实上一直是挺喜欢写blog的.可是近期在写blog这件事上遇到或者開始思考一些问题了. 首先,写blog的动机.对于这个问题,我从自己的理解上得出下面几个原因: 写blog是对自己学到知识的一种总 ...
- 从零开始学android开发-Json转换利器Gson之实例
Gson 是 Google 提供的用来在 Java 对象和 JSON 数据之间进行映射的 Java 类库.可以将一个 JSON 字符串转成一个 Java 对象,或者反过来. jar和源码下载地址: h ...
- Eclipse安装ADT失败解决办法
Eclipse的版本是3.5.2,配置Android的开发环境时遇到问题…… 按照Android官方文档一步步安装,到了安装Eclipse的ADT插件时,提示“requires 'org.eclips ...
- python抓取伯乐在线的全部文章,对标题分词后存入mongodb中
依赖包: 1.pymongo 2.jieba # -*- coding: utf-8 -*- """ @author: jiangfuqiang "" ...
- 获取用户ip接口
<script type="text/javascript" charset="gb2312" src="http://counter.sina ...
- Jordan Lecture Note-2: Maximal Margin Classifier
Maximal Margin Classifier Logistic Regression 与 SVM 思路的不同点:logistic regression强调所有点尽可能远离中间的那条分割线,而SV ...
- php面试常用算法
这些都是真实的IT公司招聘PHP程序员的面试题,这些都是简单的基本算法.包括:冒泡算法.快速排序算法.二分查找算法.顺序算法. 冒泡排序,对象可以是一个数组 01 function bubble_so ...
- java技术栈:一、java编程语言概述
Java是一种编程语言,起源于20世纪90年代初Sun公司的一个叫Green的项目,该项目主要目的是是开发嵌入家用电器的分布式软件系统,从而使电器更加智能化.因为项目小组成员皆为C++的高手(那个年代 ...