<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>textAlign</title>
</head>
<body>
 <!-- textAlign:left/right/center/start/end-->

<canvas id="myCanvas" width="578" height="200" style="border: 1px solid #CCC;"></canvas>
    <script>
        var canvas = document.getElementById('myCanvas');
        var context = canvas.getContext('2d');
        var x = canvas.width / 2;
        var y = canvas.height / 2;

context.font = '30pt Calibri';
        context.textAlign = 'center';
        context.strokeStyle = 'blue';
        context.strokeText('Hello World!',x,y);
    </script>

</body>
</html>

textAlign的更多相关文章

  1. div样式text-align在子元素缩进不规范的情况下，chrome出现的问题（貌似结果是inline-block导致的）

    在调css的时候,发现居然有firefox实现效果完整而chrome出现问题的情况: 详细情况:segmentfault1 segmentfault2 全文表达: <html><he ...

  2. text-align=center 失效原因

    text-align属性是针对 内联元素居中得属性设置,对于块状元素使用margin:0 auto;来控制居中: 笔者在设置一个h2标签时设置了text-align:center;但是却始终出现在中间 ...

  3. margin:0 auto 与 text-align:center

    1.text-align:通过指定行框与哪个点对齐,从而设置块级元素内文本的水平对齐方式;            text-align:center 设置文本或img标签等一些内联对象的居中. 2.m ...

  4. margin:0 auto 与 text-align:center 的区别

    基本概念: 1.text-align: 属性规定元素中的文本的水平对齐方式;   该属性通过指定行框与哪个点对齐,从而设置块级元素内文本的水平对齐方式;  一般情况下设置文本对齐方式的时使用此属性.支 ...

  5. text-align:justify的使用

    在平常的开发过程中,对于text-align一般用到的是left,center,right,这三个属性都不会陌生.然而,对于justify的使用我却是很陌生.首先有个比较简单的例子. 首先是html代 ...

  6. CSS魔法堂：你真的懂text-align吗？

    前言 也许提及text-align你会想起水平居中,但除了这个你对它还有多少了解呢?本篇打算和大家一起来跟text-align来一次负距离的交往,你准备好了吗? text-align属性详解 The ...

  7. text-align:justify_内容居中对齐

    一直发现text-align : justify这个对齐方式不好使,都不知道为什么么么哒: 因为两端对齐的这个行的结束要一个有空字符串或者别的不可见的字符,用户代理会把这个行的最后几个字符往右边拉,实 ...

  8. 文字对齐之text-align总结

    一.文字对齐总结: 下面是我实际运用中遇到的问题总结: css代码: 效果(段落文字没有对齐): 去掉html中的<p>标签,css样式同样去掉p标签,效果如下(达到预期效果): 为什么在 ...

  9. text-align:-moz-center与text-align:-webkit-center区别与用法

    最近发现各浏览器的不兼容,关于text-align:center这个很多浏览器不兼容. 1.测试发现:text-align:center在IE下是管用的. 2.text-align:-moz-cent ...

  10. 关于text-align无法居中的问题

    昨天项目,一直出现一个无法居中的问题,最后发现竟然是text-align的问题,才发现自己对text-align的理解还是不够透彻,于是在此再举例分析下. css中的元素一共有三类:块元素.行内块和内 ...

随机推荐

  1. Python Web学习笔记之TCP、UDP、ICMP、IGMP的解释和区别

    TCP与UDP解释 TCP---传输控制协议,提供的是面向连接.可靠的字节流服务.当客户和服务器彼此交换数据前,必须先在双方之间建立一个TCP连接,之后才能传输数据.TCP提供超时重发,丢弃重复数据, ...

  2. DBCP、c3p0、Druid三大连接池区别

    DBCP.c3p0.Druid三大连接池区别 一.连接池优势 如果一个项目中如果需要多个连接,如果一直获取连接,断开连接,这样比较浪费资源: 如果创建一个池,用池来管理Connection,这样就可以 ...

  3. QtQuickcontrols2控件使用参考

    随着Qt的版本升级,其自带的controls控件库也不断升级,目前已经到了2.3的版本.本文通过解读Qt自带的gallery例程,说明新版本controls控件库的相关特性.其具体位置于: 因为相关的 ...

  4. 20145333茹翔 Exp5 MS08_067漏洞测试

    20145333茹翔 Exp5 MS08_067漏洞测试 实验过程 IP:kali:192.168.31.177.windows 2003 :192.168.31.223 使用命令msfconsole ...

  5. windows下的gvim和emmet 下载和安装 + "omnifunc is not set" solution?

    注意几个地方: 引导键是ctrl-y, 其他就是实际的操作键了, 如: n下一个插入点, N是上一个插入点(不是p), ctrl-y + i是自动为图片添加宽度和高度尺寸, 要点是要把光标移动到 im ...

  6. P4879 ycz的妹子

    思路 让你干啥你就干啥呗 查询第x个妹子就get一下再修改 这里稳一点就维护了三个东西,也许两个也可以 代码 #include <iostream> #include <cstdio ...

  7. luogu1049装箱问题

    装箱问题 传送门 一个箱子容量为V//容量 同时有n个物品//n个 体积&&价值 要求n个物品中任取若干个装入箱内,使箱子的剩余空间为最小// v减去价值最大 */ #include& ...

  8. BZOJ3884: 上帝与集合的正确用法 拓展欧拉定理

    Description   根据一些书上的记载,上帝的一次失败的创世经历是这样的: 第一天, 上帝创造了一个世界的基本元素,称做“元”. 第二天, 上帝创造了一个新的元素,称作“α”.“α”被定义为“ ...

  9. Cassandra学习笔记

    CASSANDRA在工作中用过,但是用的项目少,能用却了解的不全面.今天来稍加学习下: http://zqhxuyuan.github.io/2015/10/15/Cassandra-Daily/  ...

  10. MongoDB（课时24 全文索引）

    3.6.3 全文索引 在一些信息管理平台上经常需要进行信息模糊查询,最早的时候是利用了某个字段上实现的模糊查询,但这个时候返回的信息并不会很准确,因为只能够查A字段或B字段,而在MongoDB里面实现 ...