<!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. Nginx服务器之负载均衡策略（6种）

    一.关于Nginx的负载均衡 在服务器集群中,Nginx起到一个代理服务器的角色(即反向代理),为了避免单独一个服务器压力过大,将来自用户的请求转发给不同的服务器.详情请查看我的另一篇博客. 二.Ng ...

  2. Android 深入理解Activity 页面Intent跳转

  3. 06: Django Admin

    目录:Django其他篇 01:Django基础篇 02:Django进阶篇 03:Django数据库操作--->Model 04: Form 验证用户数据 & 生成html 05:Mo ...

  4. 20145329 《网络对抗技术》客户端Adobe阅读器渗透攻击

    两台虚拟机: kali ip:192.168.96.130 windows xp sp3 ip:192.168.96.133 1.kali下打开显示隐藏文件 2.在kali终端中开启msfconsol ...

  5. C语言结构体，点运算和箭头运算

    C语言有一种数据类型叫结构体,其定义格式为: struct 结构体名 { 结构体成员变量定义; }; 如: struct student { char name[20]; int age ; doub ...

  6. Python3基础 os mkdirs 创建多层文件夹

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  7. UVA 3942 Remember the Word （Trie+DP）题解

    思路: 大白里Trie的例题,开篇就是一句很容易推出....orz 这里需要Trie+DP解决. 仔细想想我们可以得到dp[i]=sum(dp[i+len[x]]). 这里需要解释一下:dp是从最后一 ...

  8. Java自学入门新的体会0.2

    Java 基本数据类型 变量就是申请内存来存储值,也就是说,当创建变量的时候,需要在内存中申请空间. 内存管理系统根据变量的类型为变量分配存储空间,分配的空间只能用来存储该类型数据. 因此,通过定义不 ...

  9. Asp.net自定义单选复选框控件

    将常用的jquery插件封装成控件也是个不错的选择 下面是效果的简单颜色,由于博客系统的限制没法完整演示最终效果,请下载示例查看 Asp.netWeb APIC#Javascript   1.新建类库 ...

  10. 机器学习-数据可视化神器matplotlib学习之路（二）

    之前学习了matplotlib的一些基本画图方法(查看上一节),这次主要是学习在图中加一些文字和其其它有趣的东西. 先来个最简单的图 from matplotlib import pyplot as ...