canvas筆記 文字水平垂直對齊與度量

2021-10-06 17:55:33 字數 760 閱讀 7762

在canvas中通過textalign可以設定文字的對齊:

其中left為左對齊,center為居中對齊,right為右對齊。

程式執行截圖如下:

原始碼如下:

當前瀏覽器不支援canvas

上面是指水平對齊,下面記錄下垂直對齊

通過呼叫textbaseline函式進行垂直對齊,其中top為向上對齊,middle為居中對齊,bottom為底部對齊,預設情況下是alphabetic,還有2給引數乙個是ideographic為中文,hanging為印度文的。

下面簡單記錄下。

程式執行截圖如下:

原始碼如下:

當前瀏覽器不支援canvas

下面是文字的度量

再canvas中通過measuretext(string).width可以獲取其長度。

程式執行截圖如下:

原始碼如下:

當前瀏覽器不支援canvas

css 文字的水平垂直對齊

水平居中 text align 應用於塊級元素的文字水平居中 text align left 左對齊 text align right 右對齊 text align justify 兩端對齊 text align center 水平居中 將塊級元素中的內聯元素設定為水平居中,並不能使塊級元素水平居中...

css基礎 文字對齊,水平對齊,垂直對齊

先說水平對齊,那首先想到的就是text align了,text align left,text align center,text align right,代表的就是左對齊,居中對齊和右對齊,需要注意的是如果有padding這類的東西在,千萬看清楚兩邊的padding值是否相 同,當你看到文字不在中...

CSS 布局 水平 垂直對齊

元素居中對齊 要水平居中對齊乙個元素,可以使用 margin auto 設定到元素的寬度將防止它溢位到容器的邊緣 元素通過指定寬度,並將兩邊的空外邊距平均分配 水平居中塊級元素 如 div 可以使用 marig auto 注意 使用 margin auto 無法相容 ie8,除非 doctype 已...