From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/zh-cn/web/css/text-size-adjust/index.html | 100 ++++++++++++++++++++++++ 1 file changed, 100 insertions(+) create mode 100644 files/zh-cn/web/css/text-size-adjust/index.html (limited to 'files/zh-cn/web/css/text-size-adjust/index.html') diff --git a/files/zh-cn/web/css/text-size-adjust/index.html b/files/zh-cn/web/css/text-size-adjust/index.html new file mode 100644 index 0000000000..c910ead2db --- /dev/null +++ b/files/zh-cn/web/css/text-size-adjust/index.html @@ -0,0 +1,100 @@ +--- +title: text-size-adjust +slug: Web/CSS/text-size-adjust +tags: + - CSS + - 参考 + - 移动平台 +translation_of: Web/CSS/text-size-adjust +--- +
{{CSSRef}}{{SeeCompatTable}}
+ +

 text-size-adjust CSS 控制将一些手机或平板设备上使用的文本溢出算法（text inflation algorithm）。其他类型的设备上的浏览器会忽略此属性。

+ +
/* 专有属性值 */
+text-size-adjust: none;
+text-size-adjust: auto;
+
+/* <percentage> 值 */
+text-size-adjust: 80%;
+
+/* 全局属性值 */
+text-size-adjust: inherit;
+text-size-adjust: initial;
+text-size-adjust: unset;
+
+ +

因为许多网站还没有适配屏幕较小的设备，移动设备的浏览器和桌面浏览器在渲染网页时可能会有不同。他们不是以设备屏幕宽度布局网页，而是用比屏幕宽一些的 {{glossary("viewport", "视窗")}} 去布局网页，通常是 800 到 1000 像素。为了将视窗上的布局映射到原始设备屏幕上，手机浏览器要么只渲染整个页面的一部分，要么将视窗缩放至原始屏幕大小。

+ +

因为缩放适配小屏幕而导致文字会变得很小，许多手机浏览器会使用文本溢出算法放大文本，改善可读性。当一个包含文本的元素使用了 100% 的屏幕宽度，该算法会增加文本大小，但是不会修改布局。text-size-adjust 这个属性允许开发者去除或者修改浏览器的这种行为，比如，当网页已经适配了小屏幕之后，就不需要这么做了。

+ +
注意: + + +
+ +

{{cssinfo}}

+ +

语法

+ +

text-size-adjust 属性的值为 none, auto，或 <percentage>

+ +

属性值

+ +
+
none
+
禁用浏览器的文本溢出算法。
+
auto
+
启用浏览器的文本溢出算法。该值一般用于取消先前使用 CSS 设置的 none。
+
<percentage> +
启用浏览器的文本溢出算法，并使用用一个百分数来确定文本放大程度。
+
+ +

形式化语法

+ +
{{csssyntax}}
+ +

规范

+ + + + + + + + + + + + + + + + +
规范状态备注
{{SpecName("CSS Text Size Adjust", "#adjustment-control", "text-size-adjust")}}{{Spec2("CSS Text Size Adjust")}}Initial definition
+ +

浏览器兼容性

+ + + +

{{Compat("css.properties.text-size-adjust")}}

+ +

[1] There is a bug in older WebKit-based desktop browsers. If -webkit-text-size-adjust is explicitly set to none, older Webkit-based desktop browsers, instead of ignoring the property, will prevent the user from zooming in or out of the web page. See Bug 56543 (affected Safari≤5 & Chrome≤26), Bug 163359, and Bug 84186.

+ +

[2] In addition to the -moz- prefixed support, Gecko 44.0 {{geckoRelease("44.0")}} added support for a -webkit- prefixed version of the property for web compatibility reasons behind the layout.css.prefixes.webkit flag, defaulting to false. Since Gecko 49.0 {{geckoRelease("49.0")}} the preference defaults to true.

+ +

[3] If the viewport is set using {{HTMLElement("meta")}} element, the value of the CSS text-size-adjust property is ignored. See detailed implementation hints on MSDN.

+ +

参见

+ + -- cgit v1.2.3-54-g00ecf