<!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. ELK学习笔记之Logstash和Filebeat解析对java异常堆栈下多行日志配置支持

    0x00 概述 logstash官方最新文档.假设有几十台服务器,每台服务器要监控系统日志syslog.tomcat日志.nginx日志.mysql日志等等,监控OOM.内存低下进程被kill.ngi ...

  2. mysql hang and srv_error_monitor_thread using 100% cpu(已解决)

    昨天晚上,运维过来说有台生产服务器的mysql cpu一直100%,新的客户端登录不了,但是已经在运行的应用都正常可用. 登录服务器后,top -H看了下,其中一个线程的cpu 一直100%,其他的几 ...

  3. linux一键安装包

  4. Python3基础 yield 在函数中的用法示例

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

  5. ubuntu搭建discuz论坛

    a.安装mysql database 1.安装mysql服务端 sudo apt-get install mysql-server  (在此过程中要求为mysql的root用户设置一个密码) 2.安装 ...

  6. 【自定义IK词典】Elasticsearch之中文分词器插件es-ik的自定义词库

    Elasticsearch之中文分词器插件es-ik 针对一些特殊的词语在分词的时候也需要能够识别 有人会问,那么,例如: 如果我想根据自己的本家姓氏来查询,如zhouls,姓氏“周”.      如 ...

  7. 第九章 对称加密算法--IDEA

    注意:本节内容主要参考自<Java加密与解密的艺术(第2版)>第7章“初等加密算法--对称加密算法” 9.1.IDEA 特点: 先于AES出来取代DES 安全性极高 常用于电子邮件加密算法 ...

  8. 4、CommonChunkPlugin提取公共js-提取多个

    cnpm install css-loader --save-dev    //css-loader 是将css打包进js cnpm install style-loader --save-dev   ...

  9. Java初始化块的作用

    1.使代码更简洁 eg: public class Test { private void init() { System.out.println("初始化状态"); } publ ...

  10. for循环,定时器,闭包混合一块的那点事。

    1,对于一个基本的for循环,顺序输出变量值. for(var i = 1; i < 4; i++){ console.log(i);//结果不多说了吧 } 2,如果for循环中有定时器,如下代 ...