html文本两端对齐代码,html5图片文本左右对齐
水平对齐textAlign
Java Script语言代码复制内容到剪贴板语境。textalign= center end left right start ；其中各值及意义如下表。值描述开始默认。文本在指定的位置开始结束。文本在指定的位置结束中心。文本的中心被放置在指定的位置左边1000。文本左对齐，对吧文本右对齐。
我们通过一个例子来直观的感受一下。
Java Script语言代码复制内容到剪贴板！doctype html html lang= zh head meta charset= UTF-8 title text align/title style body { background:URL( ./images/bg3 . jpg’)重复；} # canvas { border:1px solid # aaaaaa；显示：块；保证金：50pxauto }/style/head body divid= canvas-warp canvasid= canvas 你的浏览器居然不支持画布？赶快换一个吧！/画布/div脚本窗户。onload=function(){ var canvas=document。getelementbyid(“canvas”)；canvas . width=800 canvas . height=600 var context=canvas获取上下文(“2d”)；语境。填充样式= # FFF ；context.fillRect(0，0，800，600)；//在位置400创建蓝线context . stroke style= blue context . move to(400，100)；context.lineTo(400，500)；语境。笔画()；context . fill style= # 000 context . font= 50pxArial//显示不同的文本对齐值context . textalign= start context。填充文本( textAlign=start ，400，120)；context.textAlign= endcontext。填充文本( textAlign=end ，400，200)；context.textAlign= leftcontext。填充文本( textAlign=left ，400，280)；context . textalign= center context。填充文本( textAlign=center ，400，360)；context . textalign= right context。填充文本( textAlign=right ，400，480)；};/script /body /html运行结果：
垂直对齐textBaseline
Java Script语言代码复制内容到剪贴板context.textBaseline=字母顶部悬挂中间表意底部；其中各值及意义如下表。值描述字母的默认。文本基线是普通的字母基线顶上。文本基线是全身长的方框的顶端吊死。文本基线是悬挂基线中间。文本基线是全身长的方框的正中表意的。文本基线是表意基线底部。文本基线是全身长的方框的底端。
首先咱们通过一个图来看一下各个基线代表的位置。我们通过一个例子来直观的感受一下。
Java Script语言代码复制内容到剪贴板！doctype html html lang= zh head meta charset= UTF-8 标题文本基线/标题样式正文{ background:URL( ./images/bg3 . jpg’)重复；} # canvas { border:1px solid # aaaaaa；显示：块；保证金：50pxauto }/style/head body divid= canvas-warp canvasid= canvas 你的浏览器居然不支持画布？赶快换一个吧！/画布/div脚本窗户。onload=function(){ var canvas=document。getelementbyid(“canvas”)；canvas . width=800 canvas . height=600 var context=canvas获取上下文(“2d”)；语境。填充样式= # FFF ；context.fillRect(0，0，800，600)；//在位置y=300绘制蓝色线条context . stroke style= blue context . move to(0，300)；context.lineTo(800，300)；语境。笔画()；语境。填充样式= # 00 AAAA ；context.font= 20pxArial//在y=300以不同的文本基线值放置每个单词context . text baseline= Top context . fill text( Top ，150，300)；context . text baseline= Bottom context . fill text( Bottom ，250，300)；context . text baseline= Middle context . fill text( Middle ，350，300)；语境。文本基线=字母；context.fillText(字母,450,300);语境。文本基线=悬挂；context.fillText(悬挂,550,300);};/script /body /html运行结果：
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。