tmui-cli 2.0.2 → 2.0.4

package/data/uniappx/css/right.md

@@ -0,0 +1,260 @@
+## right
+
+right CSS 属性定义了定位元素的右外边距边界与其包含块右边界之间的偏移，非定位元素设置此属性无效。
+
+### uni-app x 兼容性 
+| Web | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- |
+| 4.0 | 3.9 | 4.11 | 4.61 |
+
+### App平台拍平（flatten）兼容性  @flatten_compatibility
+
+| Android(Vapor) | iOS(Vapor) | HarmonyOS(Vapor) |
+| :- | :- | :- |
+| 5.21 | 5.11 | 5.0 |
+
+### 语法
+```
+right: <length> | <percentage> | auto;
+```
+
+### 值限制
+- length
+- percentage
+
+### right 的属性值
+| 名称 | 兼容性 | 描述 |
+| :- | :- | :- |
+| auto | Web 4.0 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 这个关键字表示：<br/>    <br/>      对于绝对定位元素，元素将忽略此属性而以 left 属性为准，如果此时设置 width: auto，将基于内容需要的宽度设置宽度；如果 left 也为 auto 的话，元素的水平位置就是它假如作为静态（即 static）元素时该在的位置。<br/>      对于相对定位元素，元素相对正常位置的偏移量将基于 left 属性；如果 left 也为 auto 的话，元素将不会有偏移。 |
+
+### 默认值 @default-value 
+ `auto`
+
+### 示例 
+ 示例为[hello uni-app x alpha分支](https://gitcode.com/dcloud/hello-uni-app-x/blob/prod_alpha/pages/CSS/layout/right.uvue)，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例[另见](https://gitcode.com/dcloud/hello-uni-app-x/blob/master//pages/CSS/layout/right.uvue) 
+::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/CSS/layout/right
+
+> appRedirect https://hellouniappx.dcloud.net.cn/appredirect.html?path=pages/CSS/layout/right
+
+>示例
+```vue
+<template>
+  
+  <scroll-view class="uni-theme-root" style="flex: 1">
+  
+    <view class="css-page uni-theme-root" style="flex-grow: 1;">
+      <view class="uni-common-mb">
+        <text class="uni-title-text">right: 20px (距离右边 20px) - 右侧：拍平</text>
+        <view class="test-container">
+          <view class="example-box">
+            <view class="common" style="right: 20px;"></view>
+          </view>
+          <view class="example-box">
+            <view class="common" style="right: 20px;" flatten></view>
+          </view>
+        </view>
+      </view>
+
+      <view class="uni-common-mb">
+        <text class="uni-title-text">right: 20rpx (距离右边 20rpx) - 右侧：拍平</text>
+        <view class="test-container">
+          <view class="example-box">
+            <view class="common" style="right: 20rpx;"></view>
+          </view>
+          <view class="example-box">
+            <view class="common" style="right: 20rpx;" flatten></view>
+          </view>
+        </view>
+      </view>
+
+      <view class="uni-common-mb">
+        <text class="uni-title-text">right: 20% (距离右边 20%) - 右侧：拍平</text>
+        <view class="test-container">
+          <view class="example-box">
+            <view class="common" style="right: 20%;"></view>
+          </view>
+          <view class="example-box">
+            <view class="common" style="right: 20%;" flatten></view>
+          </view>
+        </view>
+      </view>
+
+      <view class="uni-common-mb">
+        <text class="uni-title-text">right: auto (自动，默认左边对齐) - 右侧：拍平</text>
+        <view class="test-container">
+          <view class="example-box">
+            <view class="common" style="right: auto;"></view>
+          </view>
+          <view class="example-box">
+            <view class="common" style="right: auto;" flatten></view>
+          </view>
+        </view>
+      </view>
+
+      <text class="uni-title-text uni-common-mt">scroll-view 组件</text>
+
+      <view class="uni-common-mb">
+        <text class="uni-subtitle-text">right: 10% 和 right: 30px</text>
+        <view class="test-container">
+          <view class="example-box">
+            <scroll-view class="common" style="right: 10%;"></scroll-view>
+          </view>
+          <view class="example-box">
+            <scroll-view class="common" style="right: 30px;"></scroll-view>
+          </view>
+        </view>
+      </view>
+
+      <view class="uni-common-mt">
+        <text class="uni-title-text">setProperty 设置与 getPropertyValue 获取</text>
+      </view>
+
+      
+      <view class="test-container">
+        <view class="test-item">
+          <text class="uni-subtitle-text">view 组件</text>
+          <text class="uni-info">设置值: {{data.right}}</text>
+          <text class="uni-info">获取值: {{data.rightActual}}</text>
+          <view class="test-box">
+            <view ref="viewRef" class="common test-view" :style="{ right: data.right }">
+              <text class="common-text">view</text>
+            </view>
+          </view>
+        </view>
+
+        <view class="test-item">
+          <text class="uni-subtitle-text">text 组件</text>
+          <text class="uni-info">设置值: {{data.right}}</text>
+          <text class="uni-info">获取值: {{data.rightActualText}}</text>
+          <view class="test-box">
+            <text ref="textRef" class="common common-text test-text" :style="{ right: data.right }">text</text>
+          </view>
+        </view>
+
+        <view class="test-item">
+          <text class="uni-subtitle-text">image 组件</text>
+          <text class="uni-info">设置值: {{data.right}}</text>
+          <text class="uni-info">获取值: {{data.rightActualImage}}</text>
+          <view class="test-box">
+            <image ref="imageRef" class="common test-image" :style="{ right: data.right }" src="/static/test-image/logo.png"></image>
+          </view>
+        </view>
+      </view>
+
+      
+      <view class="test-container">
+        <view class="test-item">
+          <text class="uni-subtitle-text">view 组件拍平</text>
+          <text class="uni-info">设置值: {{data.right}}</text>
+          <text class="uni-info">获取值: {{data.rightActualFlat}}</text>
+          <view class="test-box">
+            <view ref="viewRefFlat" class="common test-view-flatten" :style="{ right: data.right }" flatten>
+              <text class="common-text">view</text>
+            </view>
+          </view>
+        </view>
+
+        <view class="test-item">
+          <text class="uni-subtitle-text">text 组件拍平</text>
+          <text class="uni-info">设置值: {{data.right}}</text>
+          <text class="uni-info">获取值: {{data.rightActualTextFlat}}</text>
+          <view class="test-box">
+            <text ref="textRefFlat" class="common common-text test-text-flatten" :style="{ right: data.right }" flatten>text</text>
+          </view>
+        </view>
+
+        <view class="test-item">
+          <text class="uni-subtitle-text">image 组件拍平</text>
+          <text class="uni-info">设置值: {{data.right}}</text>
+          <text class="uni-info">获取值: {{data.rightActualImageFlat}}</text>
+          <view class="test-box">
+            <image ref="imageRefFlat" class="common test-image-flatten" :style="{ right: data.right }" flatten src="/static/test-image/logo.png"></image>
+          </view>
+        </view>
+      </view>
+
+      <view class="uni-common-mt uni-common-mb">
+        <text class="uni-tips">第一个枚举值，'' (空字符串) - 空值情况</text>
+        <enum-data :items="rightEnum" title="right 枚举值" @change="radioChangeRight" :compact="true"></enum-data>
+        <input-data :defaultValue="data.right" title="right 自定义值" type="text" @confirm="inputChangeRight"></input-data>
+      </view>
+
+      
+      <view class="uni-common-mb">
+        <text class="theme-label">native-view组件: right: 10% 和 right: 30px</text>
+        <view class="test-container">
+          <view class="example-box">
+            <test-native-view class="common-native" style="right: 10%;"></test-native-view>
+          </view>
+          <view class="example-box">
+            <test-native-view class="common-native" style="right: 30px;"></test-native-view>
+          </view>
+        </view>
+      </view>
+      
+    </view>
+  
+  </scroll-view>
+  
+</template>
+
+
+
+<style>
+  .theme-label {
+    color: var(--text-color, #333333);
+  }
+
+  .example-box {
+    position: relative;
+    flex: 1;
+    height: 60px;
+    background-color: #f5f5f5;
+    border: 1px solid #ddd;
+    margin: 0 5px;
+  }
+
+  .common {
+    position: absolute;
+    width: 60px;
+    height: 60px;
+    background-color: cyan;
+  }
+
+  .common-text {
+    width: 50px;
+    font-size: 12px;
+    color: #1a1a1a;
+  }
+
+  .test-container {
+    flex-direction: row;
+    justify-content: space-between;
+    margin-top: 10px;
+  }
+
+  .test-item {
+    flex: 1;
+    margin: 0 5px;
+  }
+
+  .test-box {
+    position: relative;
+    width: 100%;
+    height: 60px;
+    background-color: #e0e0e0;
+  }
+
+  .common-native {
+    position: absolute;
+    width: 60px;
+    height: 60px;
+    background-color: #00FFFF;
+  }
+</style>
+
+```
+
+### 参见
+- [MDN Reference](https://developer.mozilla.org/docs/Web/CSS/right)
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=css.properties.position.right)

package/data/uniappx/css/text-align.md

@@ -0,0 +1,154 @@
+## text-align
+
+text-align 属性设置元素中文本内容的水平对齐方式。
+
+### uni-app x 兼容性 
+| Web | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- |
+| 4.0 | 3.9 | 4.11 | 4.61 |
+
+### App平台拍平（flatten）兼容性  @flatten_compatibility
+
+| Android(Vapor) | iOS(Vapor) | HarmonyOS(Vapor) |
+| :- | :- | :- |
+| 5.21 | 5.11 | 5.0 |
+
+### 语法
+```
+text-align: start | end | left | right | center | justify | match-parent;
+```
+
+### 值限制
+- enum
+
+### text-align 的属性值
+| 名称 | 兼容性 | 描述 |
+| :- | :- | :- |
+| left | Web 4.0 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 行内内容向左侧边对齐。 |
+| center | Web 4.0 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 行内内容居中。 |
+| right | Web 4.0 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 行内内容向右侧边对齐。 |
+| justify | Web 4.0 / Android 系统版本 8.0 / Android(VDOM) x / Android(Vapor) 5.25 / iOS(VDOM) x / iOS(Vapor) 5.25 / HarmonyOS(VDOM) x / HarmonyOS(Vapor) 5.25（部分支持，见上） | 文字向两侧对齐，对最后一行无效。 |
+
+### 默认值 @default-value 
+ | 平台 | 默认值 |
+| :- | :- |
+| uvue-app | left |
+| uvue-web | left |
+
+ **注意**：W3C 默认值为：start
+
+### 适用组件 @unix-tags 
+ - text
+- button
+- input
+- textarea
+
+### 示例 
+ 示例为[hello uni-app x alpha分支](https://gitcode.com/dcloud/hello-uni-app-x/blob/prod_alpha/pages/CSS/text/text-align.uvue)，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例[另见](https://gitcode.com/dcloud/hello-uni-app-x/blob/master//pages/CSS/text/text-align.uvue) 
+::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/CSS/text/text-align
+
+> appRedirect https://hellouniappx.dcloud.net.cn/appredirect.html?path=pages/CSS/text/text-align
+
+>示例
+```vue
+<template>
+	<view style="flex-grow: 1;">
+		<view class="box">
+			<text class="common" style="text-align: left;">text-align: left</text>
+			<text class="common" style="text-align: center;">text-align: center</text>
+			<text class="common2" style="text-align: center;">text-align: center</text>
+			<text class="common" style="text-align: right;">text-align: right</text>
+			<text class="common" style="text-align: justify;">text-align: justify hello uni-app x</text>
+		</view>
+    <text class="uni-title-text">拍平版本</text>
+		<view class="box">
+			<text class="common" style="text-align: left;" flatten>text-align: left</text>
+			<text class="common" style="text-align: center;" flatten>text-align: center</text>
+			<text class="common2" style="text-align: center;" flatten>text-align: center</text>
+			<text class="common" style="text-align: right;" flatten>text-align: right</text>
+			<text class="common" style="text-align: justify;" flatten>text-align: justify hello uni-app x</text>
+		</view>
+
+		<view class="uni-common-mt">
+			<text class="uni-title-text">setProperty 设置与 getPropertyValue 获取</text>
+		</view>
+
+		<view class="common-box">
+			
+			<view class="uni-common-mt">
+				<text class="uni-title-text">text-align</text>
+				<text class="uni-info">设置值: {{data.textAlign}}</text>
+				<text class="uni-info">获取值: {{data.textAlignActual}}</text>
+				<view class="test-box">
+					<text ref="textRef" class="common-text" :style="{ textAlign: data.textAlign }">当前 text-align: {{data.textAlign}}</text>
+				</view>
+			</view>
+
+			
+			<view class="uni-common-mt">
+				<text class="uni-title-text">拍平</text>
+				<text class="uni-info">设置值: {{data.textAlign}}</text>
+				<text class="uni-info">获取值: {{data.textAlignActualFlat}}</text>
+				<view class="test-box">
+					<text ref="textRefFlat" class="common-text" :style="{ textAlign: data.textAlign }" flatten>当前 text-align: {{data.textAlign}}</text>
+				</view>
+			</view>
+		</view>
+
+		<view class="uni-common-mt uni-common-mb">
+				<text class="uni-tips">第一个枚举值，'' (空字符串) - 空值情况</text>
+				<enum-data :items="textAlignEnum" title="text-align 枚举值" @change="radioChangeTextAlign" :compact="true"></enum-data>
+				<input-data :defaultValue="data.textAlign" title="text-align 自定义值" type="text" @confirm="inputChangeTextAlign"></input-data>
+		</view>
+	</view>
+</template>
+
+<style>
+	.common {
+		width: 250px;
+		font-size: 20px;
+    background-color: lightgray;
+	}
+
+  .common2 {
+    min-width: 250px;
+    font-size: 20px;
+    background-color: lightgray;
+  }
+
+  .common-text{
+    width: 110px;
+    font-size: 14px;
+    background-color: lightgray;
+  }
+
+  .box{
+    height: 200px;
+    background-color: gray;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .common-box{
+    flex-direction: row;
+    justify-content: space-around;
+  }
+
+  .test-box {
+    width: 180px;
+    height: 80px;
+    background-color: gray;
+    justify-content: center;
+    align-items: center;
+  }
+
+</style>
+
+```
+
+#### App平台差异
+- app-android 平台，justify 对连续中文文本不生效（部分 ROM 厂商对此可能有定制行为，如：ColorOS 对连续中文有效，但对英文无效），对于中文场景业务层可以在适当的位置插入空格从而实现对齐效果。
+
+### 参见
+- [MDN Reference](https://developer.mozilla.org/docs/Web/CSS/text-align)
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=css.properties.text.text-align)

package/data/uniappx/css/text-decoration-color.md

@@ -0,0 +1,35 @@
+## text-decoration-color
+
+text-decoration-color 属性用于设置元素中文本的修饰线颜色。
+
+### uni-app x 兼容性 
+| Web | Android | iOS(VDOM) | iOS(Vapor) | HarmonyOS(VDOM) | HarmonyOS(Vapor) |
+| :- | :- | :- | :- | :- | :- |
+| 4.0 | x | x | 5.11 | x | 5.0 |
+
+### App平台拍平（flatten）兼容性  @flatten_compatibility
+
+| Android(Vapor) | iOS(Vapor) | HarmonyOS(Vapor) |
+| :- | :- | :- |
+| x | 5.11 | 5.0 |
+
+### 语法
+```
+text-decoration-color: <color>;
+```
+
+### 值限制
+- color
+
+### 适用组件 @unix-tags 
+ - text
+- button
+
+#### App平台差异
++ App平台默认颜色为文字颜色  
++ App-Android平台不支持设置修饰线颜色，修饰性颜色与文字颜色一致  
++ App-iOS 平台 VDOM 模式不支持设置修饰线颜色，修饰性颜色与文字颜色一致，蒸汽模式支持设置修饰线颜色  
+
+### 参见
+- [MDN Reference](https://developer.mozilla.org/docs/Web/CSS/text-decoration-color)
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=css.properties.text.text-decoration-color)

package/data/uniappx/css/text-decoration-line.md

@@ -0,0 +1,144 @@
+## text-decoration-line
+
+text-decoration-line 属性用于设置元素中文本的修饰线类型。
+
+### uni-app x 兼容性 
+| Web | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- |
+| 4.0 | 3.9 | 4.11 | 4.61 |
+
+### App平台拍平（flatten）兼容性  @flatten_compatibility
+
+| Android(Vapor) | iOS(Vapor) | HarmonyOS(Vapor) |
+| :- | :- | :- |
+| 5.21 | 5.11 | 5.0 |
+
+### 语法
+```
+text-decoration-line: none | [ underline || overline || line-through || blink ] | spelling-error | grammar-error;
+```
+
+### 值限制
+- enum
+
+### text-decoration-line 的属性值
+| 名称 | 兼容性 | 描述 |
+| :- | :- | :- |
+| underline | Web 4.0 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 在文本的下方有一条修饰线。 |
+| line-through | Web 4.0 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 有一条贯穿文本中间的修饰线。 |
+| overline | Web 4.0 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 在文本的上方有一条修饰线。 |
+| none | Web 4.0 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 表示没有文本修饰效果。 |
+
+### 默认值 @default-value 
+ `none`
+
+### 适用组件 @unix-tags 
+ - text
+- button
+
+### 示例 
+ 示例为[hello uni-app x alpha分支](https://gitcode.com/dcloud/hello-uni-app-x/blob/prod_alpha/pages/CSS/text/text-decoration-line.uvue)，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例[另见](https://gitcode.com/dcloud/hello-uni-app-x/blob/master//pages/CSS/text/text-decoration-line.uvue) 
+::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/CSS/text/text-decoration-line
+
+> appRedirect https://hellouniappx.dcloud.net.cn/appredirect.html?path=pages/CSS/text/text-decoration-line
+
+>示例
+```vue
+<template>
+  
+  <scroll-view style="flex: 1">
+  
+    <view style="flex-grow: 1;">
+      <view class="content">
+        <text style="text-decoration-line: underline;">text-decoration-line: underline 下划线 底部易重叠字符：,.9pQqyzgj;\{}[]</text>
+        <text style="text-decoration-line: line-through;">text-decoration-line: line-through 删除线 较多文字测试换行和裁剪效果</text>
+      </view>
+      <view class="content">
+        <text style="text-decoration-line: underline;" flatten>text-decoration-line: underline flatten</text>
+        <text style="text-decoration-line: line-through;" flatten>text-decoration-line: line-through flatten</text>
+      </view>
+      <view style="background-color: gray;justify-content: center;align-items: center;margin-bottom: 16px;">
+        <text class="common" style="text-decoration-line: underline;color: blue;" flatten>text-decoration-line: underline 自适应宽高且拍平</text>
+        <text class="common" style="text-decoration-line: line-through;color: blue;" flatten>text-decoration-line: line-through 自适应宽高且拍平</text>
+      </view>
+
+      <view class="uni-common-mt">
+        <text class="uni-title-text">setProperty 设置与 getPropertyValue 获取</text>
+      </view>
+
+      <view class="common-box">
+        
+        <view class="uni-common-mt">
+          <text class="uni-title-text">text-decoration-line</text>
+          <text class="uni-info">设置值: {{data.textDecorationLine}}</text>
+          <text class="uni-info">获取值: {{data.textDecorationLineActual}}</text>
+          <view class="test-box">
+            <text ref="textRef" class="common test-text" :style="{ textDecorationLine: data.textDecorationLine }">当前 text-decoration-line: {{data.textDecorationLine}}</text>
+          </view>
+        </view>
+
+        
+        <view class="uni-common-mt">
+          <text class="uni-title-text">拍平</text>
+          <text class="uni-info">设置值: {{data.textDecorationLine}}</text>
+          <text class="uni-info">获取值: {{data.textDecorationLineActualFlat}}</text>
+          <view class="test-box">
+            <text ref="textRefFlat" class="common test-text-flatten" :style="{ textDecorationLine: data.textDecorationLine }" flatten>当前 text-decoration-line: {{data.textDecorationLine}}</text>
+          </view>
+        </view>
+      </view>
+
+      <view class="uni-common-mt uni-common-mb">
+          <text class="uni-tips">第一个枚举值，'' (空字符串) - 空值情况</text>
+          <enum-data :items="textDecorationLineEnum" title="text-decoration-line 枚举值" @change="radioChangeTextDecorationLine" :compact="true"></enum-data>
+          <input-data :defaultValue="data.textDecorationLine" title="text-decoration-line 自定义值" type="text" @confirm="inputChangeTextDecorationLine"></input-data>
+      </view>
+    </view>
+
+		
+    
+		
+		
+
+  
+  </scroll-view>
+  
+</template>
+
+<style>
+	.common {
+		font-size: 20px;
+	}
+  .content {
+    width: 200px;
+    height: 100px;
+    background-color: gray;
+    justify-content: center;
+    align-items: center;
+    margin-bottom: 16px;
+  }
+
+  .common-box{
+    flex-direction: row;
+    justify-content: space-around;
+  }
+
+  .test-box {
+    width: 180px;
+    height: 80px;
+    background-color: gray;
+    justify-content: center;
+    align-items: center;
+  }
+
+</style>
+
+```
+
+#### App平台差异
++ text-decoration-line 样式不支持继承
++ App平台仅支持 underline 和 line-through 样式修饰线
+
+### 参见
+- [MDN Reference](https://developer.mozilla.org/docs/Web/CSS/text-decoration-line)
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=css.properties.text.text-decoration-line)

package/data/uniappx/css/text-decoration-style.md

@@ -0,0 +1,41 @@
+## text-decoration-style
+
+text-decoration-style 属性用于设置元素中文本的修饰线样式，线的样式会应用到所有被 text-decoration-line 设定的线，不能为其中的每条线设置不同的样式。
+
+### uni-app x 兼容性 
+| Web | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- |
+| 4.0 | x | x | x |
+
+### App平台拍平（flatten）兼容性  @flatten_compatibility
+
+| Android(Vapor) | iOS(Vapor) | HarmonyOS(Vapor) |
+| :- | :- | :- |
+| x | x | x |
+
+### 语法
+```
+text-decoration-style: solid | double | dotted | dashed | wavy;
+```
+
+### 值限制
+- enum
+
+### text-decoration-style 的属性值
+| 名称 | 兼容性 | 描述 |
+| :- | :- | :- |
+| solid | Web 4.0 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 实线。 |
+| dashed | Web 4.0 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 虚线。 |
+| dotted | Web 4.0 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 点划线。 |
+| wavy | Web 4.0 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 波浪线。 |
+
+### 适用组件 @unix-tags 
+ - text
+- button
+
+#### App平台差异
+text-decoration-style 样式不支持继承
+
+### 参见
+- [MDN Reference](https://developer.mozilla.org/docs/Web/CSS/text-decoration-style)
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=css.properties.text.text-decoration-style)

package/data/uniappx/css/text-decoration-thickness.md

@@ -0,0 +1,39 @@
+## text-decoration-thickness
+
+text-decoration-thickness 属性用于设置元素中文本的修饰线的粗细。
+
+### uni-app x 兼容性 
+| Web | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- |
+| 4.0 | x | x | x |
+
+### App平台拍平（flatten）兼容性  @flatten_compatibility
+
+| Android(Vapor) | iOS(Vapor) | HarmonyOS(Vapor) |
+| :- | :- | :- |
+| x | x | x |
+
+### 语法
+```
+text-decoration-thickness: auto | from-font | <length> | <percentage> ;
+```
+
+### 值限制
+- length
+
+### text-decoration-thickness 的属性值
+| 名称 | 兼容性 | 描述 |
+| :- | :- | :- |
+| auto | Web 4.0 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 自动为文本装饰线选择合适的粗细。 |
+| from-font | Web 4.0 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 如果字体文件中包含了首选的粗细值，则使用字体文件的粗细值。如果字体文件中没有包含首选的粗细值，则效果和设置为 auto 一样。 |
+
+### 适用组件 @unix-tags 
+ - text
+- button
+
+#### App平台差异
+text-decoration-thickness 样式不支持继承
+
+### 参见
+- [MDN Reference](https://developer.mozilla.org/docs/Web/CSS/text-decoration-thickness)
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=css.properties.text.text-decoration-thickness)