文本属性-位置 | text-emphasis-position
该text-emphasis-position CSS属性描述了强调标记的绘制位置。强调标记对行高的影响与ruby文本相同：如果位置不够，则会增加行高。
/* Initial value */
text-emphasis-position: over right;
/* Keywords value */
text-emphasis-position: over left;
text-emphasis-position: under right;
text-emphasis-position: under left;
text-emphasis-position: left over;
text-emphasis-position: right under;
text-emphasis-position: left under;
/* Global values */
text-emphasis-position: inherit;
text-emphasis-position: initial;
text-emphasis-position: unset;Initial value | over right |
|---|---|
Applies to | all elements |
Inherited | no |
Media | visual |
Computed value | as specified |
Animation type | discrete |
Canonical order | the unique non-ambiguous order defined by the formal grammar |
首选位置
重点标记的首选位置取决于语言。以日语为例，首选的位置是在正上方。另一方面，在中文中，首选位置是在右下方。下面的信息表总结了中文和日文中的强调标记的首选位置：
Language | Preferred position | Illustration | ||
|---|---|---|---|---|
Horizontal | Vertical | |||
Japanese | over | right | | |
| Mongolian |
| Chinese | under | right | |
注意：使用text-emphasis简写属性时，text-emphasis-position不能被设置，因此也不会被重置。
语法
可能值
over在横向书写模式下在文本上画标记。under以水平书写方式在文本下面画标记。right在垂直书写模式下在文本右侧绘制标记。left以垂直书写方式将标记画到文字的左边。
形式语法
[ over | under ] && [ right | left ]实例
有些编辑器喜欢在与ruby冲突时隐藏强调标记。在HTML中，这可以通过以下样式规则来完成：
ruby {
text-emphasis: none;
}其他编辑器则偏好在与重点标记冲突时隐藏ruby。在HTML中，这可以通过以下模式来完成：
em {
text-emphasis: dot; /* Set text-emphasis for <em> elements */
}
em rt {
display: none; /* Hide ruby inside <em> elements */
}规范
Specification | Status | Comment |
|---|---|---|
CSS Text Decoration Module Level 3The definition of 'text-emphasis' in that specification. | Candidate Recommendation | Initial definition |
浏览器兼容性
Feature | Firefox (Gecko) | Chrome | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
Basic support (over and under) | 46 (46)1 | 25.0-webkit | No support | 15.0-webkit | 6.1-webkit 7.1 |
left and right | 46 (46)1 | No support2 | No support | No support | 7.1 |
Feature | Firefox Mobile (Gecko) | Android | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
Basic support | 46 (46)1 | 4.4-webkit | No support | 33-webkit | 7.1 |
本文档系腾讯云开发者社区成员共同维护，如有问题请联系 cloudcommunity@tencent.com
