WEB标准学习路程之"CSS":2.字体font

 

字体font

  


属性


版本


兼容性


继承性


简介

font

CSS1/CSS2

IE4+ , NS4+

复合属性。设置或检索对象中的文本特性

color

CSS1

IE4+ , NS4+

检索或设置对象的文本颜色

font-family

CSS1

IE4+ , NS4+

设置或检索用于对象中文本的字体名称序列

font-size

CSS1

IE4+ , NS4+

设置或检索对象中的字体尺寸

font-size-adjust

CSS2

NONE

设置或检索用于对象中文本的字体名称序列是否强制使用同一尺寸

font-stretch

CSS2

NONE

设置或检索用于对象中文本的文字是否横向的拉伸变形

font-style

CSS1

IE4+ , NS4+

设置或检索对象中的字体样式

font-weight

CSS1

IE4+ , NS4+

设置或检索对象中的文本字体的粗细

text-decoration

CSS1

IE4+ , NS4+

检索或设置对象中的文本的装饰,如下划线、闪烁等

text-underline-position

IE专有属性

IE5.5+

设置或检索text-decoration属性定义的下划线的位置

text-shadow

CSS2

NONE

设置或检索对象中文本的文字是否有阴影及模糊效果

font-variant

CSS1

IE4+ , NS6+

设置或检索对象中的文本是否为小型的大写字母

text-transform

CSS1

IE4+ , NS4+

检索或设置对象中的文本的大小写

line-height

CSS1

IE4+ , NS4+

检索或设置对象的行高。即字体最底端与字体内部顶端之间的距离

letter-spacing

CSS1

IE4+ , NS6+

检索或设置对象中的文字之间的间隔

word-spacing

CSS1

IE4+ , NS6+

检索或设置对象中的单词之间插入的空格数。对于IE4+而言仅在MAC平台上可用


 

font

语法: 

font : font-style || font-variant || font-weight || font-size || line-height || font-family

font : caption | icon | menu | message-box | small-caption | status-bar

 

参数: 

该属性是复合属性。第一种声明方式请参阅各参数对应的属性。

第二种声明方式中的参数属于CSS2。

caption : 使用有标题的系统控件的文本字体(如按钮,菜单等)

icon : 使用图标标签的字体

menu : 使用菜单的字体

message-box : 使用信息对话框的文本字体

small-caption : 使用小控件的字体

status-bar : 使用窗口状态栏的字体

 

说明: 

设置或检索对象中的文本特性。该属性是复合属性。

第一种声明方式参数必须按照如上的排列顺序。每个参数仅允许有一个值。忽略的将使用其参数对应的独立属性的默认值。

对于如何使用用户端系统可能没有的字体,可以参阅@font-face规则。

对应的脚本特性为font。请参阅我编写的其他书目。

 

示例: 

p { font: italic small-caps 600 12pts/18pts 宋体; }

p { font: italic small-caps 600 12pts/150% Courier; }

p { font: italic small-caps 600 12pts/1.5 Courier; }

p { font: italic small-caps 600 12pts/18pts Courier; }

p { font: /18pts serif; }

p { font: oblique 100 24pts; }

H1 { font: 15pt/17pt bold "Arial" normal }
 

color

语法: color : color

 

参数: color :  指定颜色。请参阅颜色单位和附录颜色表

 

说明: 

检索或设置对象的文本颜色。无默认值。

注意,用颜色名称指定color不被一些浏览器接受。

对应的脚本特性为color。请参阅我编写的其他书目。

 

示例: 

div {color: #345456; }

div { color: rgb(100,14,200); }

div {color: menu; }

div {color: red; }

font-family

语法: 

font-family : name

font-family : cursive | fantasy | monospace | serif | sans-serif

 

参数: 

name : 字体名称。按优先顺序排列。以逗号隔开。如果字体名称包含空格,则应使用引号括起

第二种声明方式使用所列出的字体序列名称。如果使用fantasy序列,将提供默认字体序列

 

说明: 

设置或检索用于对象中文本的字体名称序列。

默认值由浏览器确定。

序列可包含嵌入字体字体。请参阅@font-face规则。

对应的脚本特性为fontFamily。请参阅我编写的其他书目。

 

示例: 

div.fixedwidth { font-family: Courier, "Courier New", monospace }

 

font-size

 语法: font-size : absolute-size | relative-size | length

 

参数: 

absolute-size : 根据对象字体进行调节。xx-small | x-small | small | medium | large | x-large | xx-large

relative-size : 相对于父对像中字体尺寸进行相对调节。使用成比例的em单位计算。larger | smaller

length : 百分数 | 由浮点数字和单位标识符组成的长度值,不可为负值。其百分比取值是基于父对象中字体的尺寸。请参阅长度单位

 

说明: 

设置或检索对象中的字体尺寸。

默认值为absolute-size的medium值。

对应的脚本特性为fontSize。请参阅我编写的其他书目。

 

示例: 

p { font-style: normal; }

p { font-size: 12px; }

p { font-size: 20%; }

font-size-adjust

语法: font-size-adjust : none | number

参数: 

none : 允许字体序列中每一字体遵守它的自己的尺寸

number : 为字体序列中所有字体强迫指定同一尺寸

 

说明: 

设置或检索用于对象中文本的字体名称序列是否强制使用同一尺寸。

目前IE5.5尚不支持此属性。

对应的脚本特性为fontSizeAdjust。请参阅我编写的其他书目。

 

示例: 

p { font-family: arial, courier; font-size-adjust: none; }

p { font-family: verdana, courier; font-size-adjust: .56; }

font-stretch

语法: 

font-stretch : normal | narrower | wider | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded

 

参数: 

normal : 不应用拉伸变形

narrower : 使用比当前设置的值导致字体宽度更小的值

wider : 使用比当前设置的值导致字体宽度更大的值

 

说明: 

设置或检索用于对象中文本的文字是否横向的拉伸变形。

改变是相对于浏览器显示的字体的正常宽度的。

目前IE5.5尚不支持此属性。

对应的脚本特性为fontStretch。请参阅我编写的其他书目。

 

示例: 

p { font-stretch: wider; }

p { font-stretch: ultra-expanded; }

font-style

语法: 

font-style : normal | italic | oblique

 

参数: 

normal : 正常的字体

italic : 斜体。对于没有斜体变量的特殊字体将应用oblique

oblique : 倾斜的字体

 

说明: 

设置或检索对象中的字体样式。

对应的脚本特性为fontStyle。请参阅我编写的其他书目。

 

示例: 

p { font-style: normal; }

p { font-style: italic; }

p { font-style: oblique; }

font-weight

语法: 

font-weight : normal | bold | bolder | lighter | number

 

参数: 

normal : 正常的字体。相当于number400。声明此值将取消之前任何设置

bold : 粗体。相当于number为700。也相当于b对象的作用

bolder : IE5+ 特粗体

lighter : IE5+ 细体

number : IE5+ 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900

 

说明: 

设置或检索对象中的文本字体的粗细。

作用由用户端系统安装的字体的特定字体变量映射决定。系统选择最近的匹配。也就是说,用户可能看不到不同值之间的差异。

对应的脚本特性为fontWeight。请参阅我编写的其他书目。

 

示例: 

span { font-weight:800; }

text-decoration

语法: 

text-decoration : none || underline || blink || overline || line-through

 

参数: 

none :  无装饰

blink :  闪烁

underline :  下划线

line-through :  贯穿线

overline :  上划线

 

说明: 

检索或设置对象中的文本的装饰。

href特性的a以及u,ins对象默认值为underline

对象strike,s,del,默认值是line-through

没有文本的对象此属性不会作用。

对应的脚本特性为textDecoration。请参阅我编写的其他书目。

 

示例: 

div { text-decoration : underline; }

div { text-decoration : underline overline; }

text-underline-position

语法: text-underline-position : below | above

 

参数: below :  在文本下面above :  在文本上面

 

说明: 

设置或检索text-decoration属性定义的下划线的位置。

对应的脚本特性为textUnderlinePosition。请参阅我编写的其他书目。

 

示例: 

p { text-underline-position: above; text-decoration: underline; }

text-shadow

语法: text-shadow : color || length || lenth|| opacity

 

参数: 

color :  指定颜色。请参阅颜色单位和附录颜色表

length :  由浮点数字和单位标识符组成的长度值。可为负值。第一个length指定阴影的水平延伸距离。第二个length指定阴影的垂直延伸距离。请参阅长度单位

opacity :  由浮点数字和单位标识符组成的长度值。不可为负值。指定模糊效果的作用距离。如果你仅仅需要模糊效果,将前两个length全部设定为0。请参阅长度单位

 

说明: 

设置或检索对象中文本的文字是否有阴影及模糊效果。

可以设定多组效果,方式是用逗号隔开。

可以被用于伪类:first-letter和 :first-line。

目前IE5.5尚不支持此属性。

对应的脚本特性为textShadow。请参阅我编写的其他书目。

 

示例: 

p { text-shadow: 0px 0px 20px yellow, 0px 0px 10px orange, red 5px -5px; }

p:first-letter { font-size: 36px; color: red; text-shadow: red 0px 0px 5px;}

 

font-variant

语法: font-variant : normal | small-caps

 

参数: 

normal : 正常的字体

small-caps : 小型的大写字母字体

 

说明: 

设置或检索对象中的文本是否为小型的大写字母。

对应的脚本特性为fontVariant。请参阅我编写的其他书目。

 

示例: 

span { font-variant: small-caps; }

text-transform

语法:text-transform : none | capitalize | uppercase | lowercase

 

参数: 

none :  无转换发生

capitalize :  将每个单词的第一个字母转换成大写其余无转换发生

uppercase :  转换成大写

lowercase :  转换成小写

 

说明: 

检索或设置对象中的文本的大小写。

对应的脚本特性为textTransform。请参阅我编写的其他书目。

 

示例: div { text-transform : uppercase; }

 

line-height

语法: line-height : normal | length

 

参数: 

normal :  默认行高

length :  百分比数字 | 由浮点数字和单位标识符组成的长度值允许为负值。其百分比取值是基于字体的高度尺寸。请参阅长度单位

 

说明: 

检索或设置对象的行高。即字体最底端与字体内部顶端之间的距离。

如行内包含多个对象,则应用最大行高。此时行高不可为负值。

对应的脚本特性为lineHeight。请参阅我编写的其他书目。

 

示例: 

div {line-height:6px; }

div {line-height:10.5; }

letter-spacing

语法: letter-spacing : normal | length

 

参数: 

normal :  默认间隔

length :  由浮点数字和单位标识符组成的长度值允许为负值。请参阅长度单位

 

说明: 

检索或设置对象中的文字之间的间隔。

该属性将指定的间隔添加到每个文字之后,但最后一个字将被排除在外。

对应的脚本特性为letterSpacing。请参阅我编写的其他书目。

 

示例: 

div {letter-spacing:6px; }

div {letter-spacing:0.5pt; }

word-spacing

语法: word-spacing : normal | length

参数: 

normal :  默认间距

length :  由浮点数字和单位标识符组成的长度值允许为负值。请参阅长度单位

 

说明: 

检索或设置对象中的单词之间插入的空格数。对于IE4+而言仅在MAC平台上可用。

对应的脚本特性为wordSpacing。请参阅我编写的其他书目。

 

示例: 

div { word-spacing : 10; }

div { word-spacing : 10px; }

=======================================================================================

文本属性text

 

 

属性

版本

兼容性

继承性

简介

text-indent

CSS1

IE4+ , NS4+

检索或设置对象中的文本的缩进

text-overflow

IE专有属性

IE6+

设置或检索是否使用一个省略标记(...)标示对象内文本的溢出

vertical-align

CSS1/CSS2

IE4+ , NS4+

设置或检索对象内容的垂直对其方式

text-align

CSS1

IE4+ , NS4+

设置或检索对象中文本的对齐方式

layout-flow

IE专有属性

IE5.5+

设置或检索对象内文本的流动和方向

writing-mode

IE专有属性

IE5.5+

设置或检索对象的内容块固有的书写方向

direction

CSS2

IE5+

用于设置文本流的方向

unicode-bidi

CSS2

IE5+

用于同一个页面里存在从不同方向读进的文本显示。与direction属性一起使用

word-break

IE专有属性

IE5+

设置或检索对象内文本的字内换行行为。尤其在出现多种语言时

line-break

IE专有属性

IE5+

设置或检索用于日文文本的换行规则

white-space

CSS1

IE5.5+ , NS4+

设置或检索对象内空格的处理方式

word-wrap

IE专有属性

IE5.5+

设置或检索当当前行超过指定容器的边界时是否断开转行

text-autospace

IE专有属性

IE5+

设置或检索对象文本的自动空格和紧缩空格宽度调整的方式

text-kashida-space

IE专有属性

IE5.5+

设置或检索如何拉伸字符来调节文本行排列

text-justify

IE专有属性

IE5+

设置或检索对象内文本的对齐方式

ruby-align

IE专有属性

IE5+

设置或检索通过rt对象指定的注释文本或发音指南(参考ruby对象)的对齐位置

ruby-position

IE专有属性

IE5+

设置或检索通过rt对象指定的注释文本或发音指南(参考ruby对象)的位置

ruby-overhang

IE专有属性

IE5+

设置或检索通过rt对象指定的注释文本或发音指南(参考ruby对象)的位置

ime-mode

IE专有属性

IE5+

设置或检索是否允许用户激活输入中文,韩文,日文等的输入法(IME)状态

layout-grid

IE专有属性

IE5+

复合属性。设置或检索复合文档中指定文本字符版式的网格特性

layout-grid-char

IE专有属性

IE5+

设置或检索应用于对象文本的字符网格值

layout-grid-char-spacing

IE专有属性

IE5+

设置或检索字符间隔

layout-grid-line

IE专有属性

IE5+

设置或检索应用于对象文本的行网格值

layout-grid-mode

IE专有属性

IE5+

设置或检索文本网格版式是否使用二维

layout-grid-type

IE专有属性

IE5+

设置或检索应用于对象文本的网格类型


 

text-indent

语法: text-indent : length

 

参数: 

length :  百分比数字|由浮点数字和单位标识符组成的长度值允许为负值。请参阅长度单位

 

说明: 

检索或设置对象中的文本的缩进。

在被另一个对象(如)断开的对象内不能应用本属性。

对应的脚本特性为textIndent。请参阅我编写的其他书目。

 

示例: 

div { text-indent : -5px; }

div { text-indent : underline 10%; }

text-overflow

语法: text-overflow : clip | ellipsis

 

参数

clip :  不显示省略标记(...),而是简单的裁切

ellipsis :  当对象内文本溢出时显示省略标记(...)

 

说明: 

设置或检索是否使用一个省略标记(...)标示对象内文本的溢出。

对应的脚本特性为textOverflow。请参阅我编写的其他书目。

 

示例:div { text-overflow : clip; }

vertical-align

语法: vertical-align : baseline |sub | super |top |text-top |middle |bottom |text-bottom |length

 

参数: 

baseline :  将支持valign特性的对象的内容与基线对齐

sub :  垂直对齐文本的下标

super :  垂直对齐文本的上标

top :  将支持valign特性的对象的内容与对象顶端对齐

text-top :  将支持valign特性的对象的文本与对象顶端对齐

middle :  将支持valign特性的对象的内容与对象中部对齐

bottom :  将支持valign特性的对象的文本与对象底端对齐

text-bottom :  将支持valign特性的对象的文本与对象顶端对齐

length :  CSS2 由浮点数字和单位标识符组成的长度值 | 或者百分数。可为负数。定义由基线算起的偏移量。基线对于数值来说为0,对于百分数来说就是0%。目前IE5尚不支持。请参阅长度单位

 

说明: 

设置或检索对象内容的垂直对其方式。

对应的脚本特性为verticalAlign。请参阅我编写的其他书目。

 

示例: td { vertical-align : center; }

text-align

语法: text-align : left | right | center | justify

 

参数: 

left :  左对齐

right :  右对齐

center :  居中

justify :  两端对齐

 

说明:

设置或检索对象中文本的对齐方式。

对应的脚本特性为textAlign。请参阅我编写的其他书目。

 

示例: div { text-align : center; }

layout-flow

语法: layout-flow : horizontal | vertical-ideographic

 

参数: 

horizontal :  对象中的内容自左边流入。下一行在前一行下面。这个值适于拉丁语系

vertical-ideographic :  对象中的内容自上而下流入,下一行在前一行左面。这个值适于亚洲语系

 

说明: 

设置或检索对象内文本的流动和方向。

当此属性值发生变化时,text-align属性与vertical-align属性的作用也将发生变化。

对应的脚本特性为layoutFlow。请参阅我编写的其他书目。

 

示例: div { layout-flow : horizontal; }

writing-mode

语法: writing-mode : lr-tb | tb-rl

 

参数: 

lr-tb : --

tb-rl : --

 

说明: 

设置或检索对象的内容块固有的书写方向。西方语言确省的是左-右,上-下的书写方式。但是亚洲语言常有上-下,右-左的书写方式。

当此属性值发生变化时,text-align属性与vertical-align属性的作用也将发生变化。

对应的脚本特性为writingMode。请参阅我编写的其他书目。

 

示例: div { writing-mode: tb-rl; }

 

direction

语法: direction : ltr | rtl | inherit

 

参数: 

ltr :  文本流从左到右

rtl :  文本流从右到左

inherit :  文本流的值不可继承

 

说明: 

用于设置文本流的方向。

假如您想应用direction属性于内联文本您必须设定unicode-bidi属性为embedbidi-override

对应的脚本特性为direction。请参阅我编写的其他书目。

示例: div { direction: rtl; unicode-bidi: bidi-override; }

unicode-bidi

语法:unicode-bidi : normal | bidi-override | embed

 

参数: 

normal :  对象不打开附加的嵌入层对于内联要素隐式重排序跨对象边界进行工作

embed :  对象打开附加的嵌入层,direction属性的值指定嵌入层在对象内部进行隐式重排序

bidi-override :  严格按照direction属性的值重排序。忽略隐式双向运算规则

 

说明: 

用于同一个页面里存在从不同方向读进的文本显示。与direction属性一起使用。

假如您想应用direction属性于内联文本,您必须设定unicode-bidi属性为embed或bidi-override。

对应的脚本特性为unicodeBidi。请参阅我编写的其他书目。

 

示例: div { direction: rtl; unicode-bidi: bidi-override; }

word-break

语法: word-break : normal | break-all | keep-all

 

参数

normal :  依照亚洲语言和非亚洲语言的文本规则允许在字内换行

break-all :  该行为与亚洲语言的normal相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本

keep-all :  与所有非亚洲语言的normal相同。对于中文,韩文,日文,不允许字断开。适合包含少量亚洲文本的非亚洲文本

 

说明: 

设置或检索对象内文本的字内换行行为。尤其在出现多种语言时。

对于中文,应该使用break-all 。

对应的脚本特性为wordBreak。请参阅我编写的其他书目。

 

示例: div {word-break : break-all; }

line-break

语法: line-break : normal | strict

 

参数: 

normal :  应用日文文本的默认换行规则

strict :  强制日文文本换行规则的严谨性

 

说明: 

设置或检索用于日文文本的换行规则。

对应的脚本特性为lineBreak。请参阅我编写的其他书目。

 

示例:div { line-break : strict; }

 

white-space

语法: white-space : normal | pre | nowrap

 

参数: 

normal :  默认处理方式

pre :  用等宽字体显示预先格式化的文本。不合并字间的空白距离和进行两端对齐。参阅pre对象

nowrap :  强制在同一行内显示所有文本,直到文本结束或者遭遇br对象。参阅td,div等对象的nowrap属性(特性)

 

说明: 

设置或检索对象内空格的处理方式。

对应的脚本特性为whiteSpace。请参阅我编写的其他书目。

 

示例: p { white-space: nowrap; }

word-wrap

语法: word-wrap : normal | break-word

 

参数: 

normal :  允许内容顶开指定的容器边界

break-word :  内容将在边界内换行。如果需要词内换行(word-break)也行发生

 

说明: 

设置或检索当当前行超过指定容器的边界时是否断开转行。

对应的脚本特性为wordWrap。请参阅我编写的其他书目。

 

示例: div { word-wrap: break-word; }

text-autospace

语法: text-autospace : none | ideograph-alpha | ideograph-numeric | ideograph-parenthesis | ideograph-space

 

参数: 

none : 无调整发生

ideograph-alpha : 表意字和非表意字Latin-based,Greek,Cyrillic,Arabic,Hebrew文本之间创建额外空格

ideograph-numeric : 在表意字和数字字符之间创建额外空格

ideograph-parenthesis : 在常规非宽度插入语和表意字之间创建额外空格

ideograph-space : 当空格相邻表意字符时,扩展空格的宽度

 

说明: 

设置或检索对象文本的自动空格和紧缩空格宽度调整的方式。

表意字是东亚编写系统中的字符,表示一个概念或方法,但不是一个特定的字或词。

对应的脚本特性为textAutospace。请参阅我编写的其他书目。

text-kashida-space

语法: text-kashida-space : length

 

参数: 

length :  百分数。标示kashida膨胀与空格膨胀的比例。为100%,仅有kashida膨胀。为0%,仅有空格膨胀。缺省值为0%

 

说明: 

设置或检索如何拉伸字符来调节文本行排列。它可以和text-justify属性一起使用。

对应的脚本特性为textKashidaSpace。请参阅我编写的其他书目。

 

示例: div { text-kashida-space : 50%; }

text-justify

语法: text-justify : auto |inter-word | newspaper | distribute | distribute-all-lines | inter-ideograph

 

参数: 

auto :  允许浏览器用户代理确定使用的两端对齐法则

inter-word :  通过增加字之间的空格对齐文本。该行为是对齐所有文本行最快的方法。它的两端对齐行为对段落的最后一行无效

newspaper :  通过增加或减少字或字母之间的空格对齐文本。是用于拉丁文字母表两端对齐的最精确格式

distribute :  处理空格很像newspaper,适用于东亚文档。尤其是泰国

distribute-all-lines :  两端对齐行的方式与distribute相同,也同样不包含两段对齐段落的最后一行。适用于表意字文档

inter-ideograph :  为表意字文本提供完全两端对齐。他增加或减少表意字和词间的空格

 

说明: 

设置或检索对象内文本的对齐方式。

对应的脚本特性为textJustify。请参阅我编写的其他书目。

 

示例: div {text-justify : auto; }

ruby-align

语法: ruby-align : auto | left | center | right | distribute-letter | distribute-space | line-edge

 

参数: 

auto :  由浏览器确定对齐方式。对于ideographic(东亚文本)以distribute-space值对齐。对于Latin文本以center值对齐

left :  根据基本宽度左对齐

center :  根据基本宽度居中对齐。如果基本宽度小于ruby文本的宽度,那么在ruby文本的宽度中居中基本宽度

right :  根据基本宽度右对齐

distribute-letter :  如果ruby文本的宽度小于基本宽度,则ruby文本在基本宽度中均匀分布。如果ruby文本的宽度大于或等于基本宽度,,居中对齐

distribute-space :  如果ruby文本的宽度小于基本宽度,则ruby文本在基本宽度中均匀分布。在ruby文本中,在第一个字符的前面后最后字符的后面有半个字距的空白区域。如果ruby文本的宽度大于或等于基本宽度,居中对齐

line-edge :  如果ruby文本不相邻行边缘,则其被居中。否则ruby文本行在基本文本边的上方

 

说明:

设置或检索通过rt对象指定的注释文本或发音指南(参考ruby对象)的对齐位置。

ruby对象及rt对象请参阅我的其他著作。

对应的脚本特性为rubyAlign。请参阅我编写的其他书目。

 

示例: ruby { ruby-align: right; }

ruby-overhang

语法: ruby-overhang : auto | whitespace | none

 

参数

auto :  ruby文本突出相邻基本文本的任何其他文本

whitespace :  ruby文本只突出空白区域的字符

none :  ruby文本只突出相邻基本文本的任何其他文本

 

说明: 

设置或检索通过rt对象指定的注释文本或发音指南(参考ruby对象)的位置。

ruby对象及rt对象请参阅我的其他著作。

对应的脚本特性为rubyOverhang。请参阅我编写的其他书目。

 

示例: ruby { ruby-overhang: auto; }

ruby-position

语法: ruby-position : above | inline

 

参数: 

above :  在基本文本上方定位ruby文本

inline :  ruby文本与基本文本内联

 

说明: 

设置或检索通过rt对象指定的注释文本或发音指南(参考ruby对象)的位置。

ruby对象及rt对象请参阅我的其他著作。

对应的脚本特性为rubyPosition。请参阅我编写的其他书目。

 

示例: ruby { ruby-position: above; }

ime-mode

语法: ime-mode : auto | active | inactive | disabled

 

参数: 

auto : 不影响IME的状态。与不指定ime-mode属性时相同

active : 指定所有使用IME输入的字符。即激活本地语言输入法。用户仍可以撤销激活IME

inactive : 指定所有不使用IME输入的字符。即激活非本地语言。用户仍可以撤销激活IME

disabled : 完全禁用IME。对于有焦点的控件如输入框),用户不可以激活IME

 

说明: 

设置或检索是否允许用户激活输入中文,韩文,日文等的输入法(IME)状态。

对应的脚本特性为imeMode。请参阅我编写的其他书目。

 

示例: <input type=text style="ime-mode: auto; ">

layout-grid

语法: layout-grid : layout-grid-mode || layout-grid-type || layout-grid-line || layout-grid-char || layout-grid-char-spacing

 

参数:该属性是复合属性。请参阅各参数对应的属性。

 

说明: 

设置或检索复合文档中指定文本字符版式的网格特性。

以东亚语言(如中文,日文)编写的文档通常根据一维或二维网格使用字符的页面版式。

对应的脚本特性为layoutGrid。请参阅我编写的其他书目。

 

示例: div { layout-grid:char line 12px 12px 5px; }

layout-grid-char

语法: layout-grid-char : none | auto | length

 

参数: 

none :  不指定行网格值

auto :  在对象文本中按最大字符确定网格

length :  百分数 | 由浮点数字和单位标识符组成的长度值,其百分比取值是基于父对象尺寸。请参阅长度单位

 

说明: 

设置或检索应用于对象文本的字符网格值。

要实现此属性,layout-grid-mode必须设置为char或both。

其视觉效果类似于line-height属性。只应用于块对象(如div)。

以东亚语言(如中文,日文)编写的文档通常根据一维或二维网格使用字符的页面版式。

对应的脚本特性为layoutGridChar。请参阅我编写的其他书目。

 

示例: div { layout-grid-char: auto; }

layout-grid-char-spacing 

语法: layout-grid-char-spacing : auto | length

 

参数: 

auto :  在对象文本中按最大字符确定网格

length :  百分数 | 由浮点数字和单位标识符组成的长度值,其百分比取值是基于父对象尺寸。请参阅长度单位

 

说明: 

设置或检索字符间隔。

要实现此属性,layout-grid-mode必须设置为char或both。layout-grid-type必须设置为loose。

其视觉效果类似于line-height属性。只应用于块对象(如div)。

以东亚语言(如中文,日文)编写的文档通常根据一维或二维网格使用字符的页面版式。

对应的脚本特性为layoutGridCharSpacing。请参阅我编写的其他书目。

 

示例: div { layout-grid-char-spacing: auto; }

 

layout-grid-line

语法: layout-grid-line : none | auto | length

 

参数: 

none :  不指定行网格值

auto :  在对象文本中按最大字符确定网格

length :  百分数 | 由浮点数字和单位标识符组成的长度值,其百分比取值是基于父对象尺寸。请参阅长度单位

 

说明: 

设置或检索应用于对象文本的行网格值。

要实现此属性,layout-grid-mode必须设置为line或both。

其视觉效果类似于line-height属性。只应用于块对象(如div)。

以东亚语言(如中文,日文)编写的文档通常根据一维或二维网格使用字符的页面版式。

对应的脚本特性为layoutGridLine。请参阅我编写的其他书目。

 

示例: div { layout-grid-line: auto; }

 

layout-grid-mode

语法: layout-grid-mode : both | line | char | none

 

参数: 

both :  指定charline都被启用。要在一个对象上完全启用网格版式,此值是必须的

line :  指定只使用行网格。建议与内联对象(如span)一起使用

char :  指定只使用字符网格。建议和块对象(如div)一起使用

none :  不使用网格

 

说明: 

设置或检索文本网格版式是否使用二维。

以东亚语言(如中文,日文)编写的文档通常根据一维或二维网格使用字符的页面版式。

对应的脚本特性为layoutGridMode。请参阅我编写的其他书目。

 

示例: div { layout-grid-mode: char; }

layout-grid-type

语法: layout-grid-type : loose | strict | fixed

 

参数: 

loose :  指定在中文或韩文中使用网格的文本,只有象形文字,假名,宽字符域网格对齐。其余的和通常一样,尽管包含这些字符的文本范围的layout-grid-mode被设置为none或line。该模式还禁用通常用于对象文本的特殊文本对齐和字符宽度调整。最后,如果不能再换行边界的文本中找到一个换行机会,那么文本将被推至下一行,并且上一行的最后留出空白

strict :  指定在日文中使用网格。规则为:如果没有其他的宽度调整效果,则增加宽字符以获取精确的网格填充。窄字符(除了草书字体)按照应用于宽字符的一半增量增加

fixed :  指定使用于等宽版式网格。规则为:所有非草书符号视为等宽。默认情况下,每个字符在单一网格中居中。禁止对齐或任何其他改变字符宽度的行为

 

说明: 

设置或检索应用于对象文本的网格类型。

只应用于块对象(如div)。

以东亚语言(如中文,日文)编写的文档通常根据一维或二维网格使用字符的页面版式。

对应的脚本特性为layoutGridType。请参阅我编写的其他书目。

 

示例: 

div { layout-grid-type: strict; }

原文地址:https://www.cnblogs.com/astar/p/1227301.html