ล่าสุดการพัฒนาเว็บบทเรียน
×

JavaScript การอ้างอิง

ภาพรวม

JavaScript

JS เชือก JS จำนวน JS ผู้ประกอบการ JS งบ JS คณิตศาสตร์ JS วันที่ JS แถว JS บูลีน JS นิพจน์ทั่วไป JS สถานการณ์โดยรวม JS การแปลง

เบราว์เซอร์ BOM

Window Navigator Screen History Location

HTML DOM

DOM เอกสาร DOM องค์ประกอบ DOM แอตทริบิวต์ DOM เหตุการณ์ DOM รูปแบบ

HTML วัตถุ

<a> <abbr> <address> <area> <article> <aside> <audio> <b> <base> <bdo> <blockquote> <body> <br> <button> <canvas> <caption> <cite> <code> <col> <colgroup> <datalist> <dd> <del> <details> <dfn> <dialog> <div> <dl> <dt> <em> <embed> <fieldset> <figcaption> <figure> <footer> <form> <head> <header> <h1> - <h6> <hr> <html> <i> <iframe> <img> <ins> <input> button <input> checkbox <input> color <input> date <input> datetime <input> datetime-local <input> email <input> file <input> hidden <input> image <input> month <input> number <input> password <input> radio <input> range <input> reset <input> search <input> submit <input> text <input> time <input> url <input> week <kbd> <keygen> <label> <legend> <li> <link> <map> <mark> <menu> <menuitem> <meta> <meter> <nav> <object> <ol> <optgroup> <option> <output> <p> <param> <pre> <progress> <q> <s> <samp> <script> <section> <select> <small> <source> <span> <strong> <style> <sub> <summary> <sup> <table> <td> <th> <tr> <textarea> <time> <title> <track> <u> <ul> <var> <video>

วัตถุอื่น ๆ

CSSStyleDeclaration


 

HTML canvas textAlign Propery

<ผ้าใบวัตถุ

ตัวอย่าง

สร้างสายสีแดงในตำแหน่ง 150 ตำแหน่ง 150 จุดยึดสำหรับทุกข้อความที่กำหนดไว้ในตัวอย่างด้านล่าง ศึกษาผลกระทบของมูลค่าทรัพย์สิน TextAlign แต่ละ:

YourbrowserdoesnotsupporttheHTML5canvastag

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");

// Create a red line in position 150
ctx.strokeStyle="red";
ctx.moveTo(150,20);
ctx.lineTo(150,170);
ctx.stroke();

ctx.font="15px Arial";

// Show the different textAlign values
ctx.textAlign="start";
ctx.fillText("textAlign=start",150,60);
ctx.textAlign="end";
ctx.fillText("textAlign=end",150,80);
ctx.textAlign="left";
ctx.fillText("textAlign=left",150,100);
ctx.textAlign="center";
ctx.fillText("textAlign=center",150,120);
ctx.textAlign="right";
ctx.fillText("textAlign=right",150,140);
ลองตัวเอง»

สนับสนุนเบราว์เซอร์

ตัวเลขในตารางระบุราว์เซอร์รุ่นแรกที่สนับสนุนอย่างเต็มที่ทรัพย์สิน

คุณสมบัติ
textAlign 4.0 9.0 3.6 4.0 10.1

ความหมายและการใช้งาน

ชุดนี้ TextAlign ทรัพย์สินหรือผลตอบแทนการจัดตำแหน่งปัจจุบันสำหรับเนื้อหาข้อความตามจุดยึด

โดยปกติข้อความจะ START ในตำแหน่งที่ระบุไว้ แต่ถ้าคุณตั้ง TextAlign = "สิทธิ" และวางข้อความในตำแหน่ง 150 ก็หมายความว่าข้อความที่ควรจะจบในตำแหน่ง 150

Tip: ใช้ fillText() หรือ strokeText() วิธีการวาดจริงและตำแหน่งข้อความบนผ้าใบ

ค่าเริ่มต้น: เริ่มต้น
ไวยากรณ์ JavaScript: context .textAlign="center|end|left|right|start";

ค่าทรัพย์สิน

ค่า ลักษณะ เล่น
เริ่มต้น ค่าเริ่มต้น. ข้อความที่เริ่มต้นที่ตำแหน่งที่ระบุไว้ เล่น "
ปลาย ข้อความที่สิ้นสุดที่ตำแหน่งที่ระบุไว้ เล่น "
ศูนย์ ศูนย์กลางของข้อความที่ถูกวางไว้ที่ตำแหน่งที่ระบุไว้ เล่น "
ซ้าย ข้อความที่เริ่มต้นที่ตำแหน่งที่ระบุไว้ เล่น "
ขวา ข้อความที่สิ้นสุดที่ตำแหน่งที่ระบุไว้ เล่น "

<ผ้าใบวัตถุ