diff --git a/1224/styled-system.md b/1224/styled-system.md index 3a4fd426fc8dc39a698b09084d16d02d7d0c39c2..c81d99320ed92557a1880cc59ef3ba50208bf2ba 100644 --- a/1224/styled-system.md +++ b/1224/styled-system.md @@ -86,131 +86,131 @@ const Box = styled.div` | Name | Description | Type | Required | HarmonyOS Support | | ------------- | ---------- | ---- | -------- | -------- | -| margin | 外边距 | prop | No | Yes | -| marginTop | 上外边距 | prop | No | Yes | -| marginRight | 右外边距 | prop | No | Yes | -| marginLeft | 左外边距 | prop | No | Yes | -| marginX | X 轴外边距 | prop | No | Yes | -| marginY | Y 轴外边距 | prop | No | Yes | -| padding | 内边距 | prop | No | Yes | -| paddingTop | 上内边距 | prop | No | Yes | -| paddingRight | 右内边距 | prop | No | Yes | -| paddingLeft | 左内边距 | prop | No | Yes | -| paddingBottom | 下内边距 | prop | No | Yes | -| paddingX | X 轴内边距 | prop | No | Yes | -| paddingY | Y 轴内边距 | prop | No | Yes | +| margin | 外边距 | prop | no | yes | +| marginTop | 上外边距 | prop | no | yes | +| marginRight | 右外边距 | prop | no | yes | +| marginLeft | 左外边距 | prop | no | yes | +| marginX | X 轴外边距 | prop | no | yes | +| marginY | Y 轴外边距 | prop | no | yes | +| padding | 内边距 | prop | no | yes | +| paddingTop | 上内边距 | prop | no | yes | +| paddingRight | 右内边距 | prop | no | yes | +| paddingLeft | 左内边距 | prop | no | yes | +| paddingBottom | 下内边距 | prop | no | yes | +| paddingX | X 轴内边距 | prop | no | yes | +| paddingY | Y 轴内边距 | prop | no | yes | **API color** | Name | Description | Type | Required | HarmonyOS Support | | ----- | ------ | ---- | -------- | -------- | -| color | 颜色 | prop | No |Yes | -| bg | 背景色 | prop | No | Yes | +| color | 颜色 | prop | no |yes | +| bg | 背景色 | prop | no | yes | **API typography** -| Name | Description | Type | Required | HarmonyOS Support | -| ------------- | -------- | ---- | -------- | -------- | -| fontFamily | 字体系列 | prop | No | Yes | -| fontSize | 字号大小 | prop | No | Yes | -| fontWeight | 字体权重 | prop | No | Yes | -| lineHeight | 行高 | prop | No | Yes | -| letterSpacing | 字符间距 | prop | No | Yes | -| textAlign | 文本对齐 | prop | No | Yes | -| fontStyle | 字体样式 | prop | No | Yes | +| Name | Description | Type | Required | HarmonyOS Support |Notes| +| ------------- | -------- | ---- | -------- | -------- |-------- | +| fontFamily | 字体系列 | prop | no | yes |与 Android、iOS效果一致，设置后均无效果 +| fontSize | 字号大小 | prop | no | yes | +| fontWeight | 字体权重 | prop | no | yes | +| lineHeight | 行高 | prop | no | yes | +| letterSpacing | 字符间距 | prop | no | yes | +| textAlign | 文本对齐 | prop | no | yes | +| fontStyle | 字体样式 | prop | no | yes | **API layout** | Name | Description | Type | Required | HarmonyOS Support | Notes | | ------------- | -------- | ---- | -------- | -------- | ---------------------------------------- | -| width | 宽度 | prop | No | Yes | -| height | 高度 | prop | No | Yes | -| display | 显示类型 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| minWidth | 最小宽度 | prop | No | Yes | -| minHeight | 最小高度 | prop | No | Yes | -| maxHeight | 最大高度 | prop | No | Yes | -| size | 大小 | prop | No | Yes | -| verticalAlign | 垂直对齐 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| overflow | 溢出 | prop | No | Yes | -| overflowX | X 轴溢出 | prop | No | Yes | -| overflowY | Y 轴溢出 | prop | No | Yes | +| width | 宽度 | prop | no | yes | +| height | 高度 | prop | no | yes | +| display | 显示类型 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| minWidth | 最小宽度 | prop | no | yes | +| minHeight | 最小高度 | prop | no | yes | +| maxHeight | 最大高度 | prop | no | yes | +| size | 大小 | prop | no | yes | +| verticalAlign | 垂直对齐 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| overflow | 溢出 | prop | no | yes | +| overflowX | X 轴溢出 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| overflowY | Y 轴溢出 | prop | no | yes |与 Android、iOS 效果一致，设置后均无效果 | **API flexbox** | Name | Description | Type | Required | HarmonyOS Support |Notes | | -------------- | --------------------- | ---- | -------- | -------- | ---------------------------------------- | -| alignItems | 列内轴对齐项 | prop | No |Yes | | -| alignContent | 列内轴对齐内容 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| justifyItems | 行内轴对齐项 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| justifyContent | 行内轴对齐内容 | prop | No | Yes | -| flexWrap | 换行 | prop | No | Yes | -| flexDirection | 弹性方向 | prop | No | Yes | -| flex | 弹性布局 | prop | No | Yes | -| flexGrow | 分配剩余空间比例 | prop | No | Yes | -| flexShrink | 弹性收缩 | prop | No | Yes | -| flexBasis | 弹性初始长度 | prop | No | Yes | -| justifySelf | 行内对齐 | prop | No | Yes | -| alignSelf | 对齐，覆盖 alignItems | prop | No | Yes | -| order | 弹性布局顺序 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | +| alignItems | 列内轴对齐项 | prop | no |yes | | +| alignContent | 列内轴对齐内容 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| justifyItems | 行内轴对齐项 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| justifyContent | 行内轴对齐内容 | prop | no | yes | +| flexWrap | 换行 | prop | no | yes | +| flexDirection | 弹性方向 | prop | no | yes | +| flex | 弹性布局 | prop | no | yes | +| flexGrow | 分配剩余空间比例 | prop | no | yes | +| flexShrink | 弹性收缩 | prop | no | yes | +| flexBasis | 弹性初始长度 | prop | no | yes | +| justifySelf | 行内对齐 | prop | no | yes | +| alignSelf | 对齐，覆盖 alignItems | prop | no | yes | +| order | 弹性布局顺序 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | **API border** | Name | Description | Type | Required | HarmonyOS Support | Notes | | ----------------------- | ------------ | ---- | -------- | -------- | ---------------------------------------- | -| border | 边框 | prop | No | Yes | -| borderWidth | 边框宽度 | prop | No | Yes | -| borderStyle | 边框样式 | prop | No | Yes | -| borderColor | 边框颜色 | prop | No | Yes | -| borderRadius | 边框圆角 | prop | No | Yes | -| borderTop | 上边框 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| borderTopWidth | 上边框宽度 | prop | No | Yes | -| borderTopStyle | 上边框样式 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| borderTopColor | 上边框颜色 | prop | No | Yes | -| borderTopLeftRadius | 上左边框圆角 | prop | No | Yes | -| borderTopRightRadius | 上右边框圆角 | prop | No | Yes | -| borderRight | 右边框 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| borderRightWidth | 右边框宽度 | prop | No | Yes | -| borderRightStyle | 右边框样式 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| borderRightColor | 右边框颜色 | prop | No | Yes | -| borderBottom | 下边框 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| borderBottomWidth | 下边框宽度 | prop | No | Yes | -| borderBottomStyle | 下边框样式 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| borderBottomColor | 下边框颜色 | prop | No | Yes | -| borderBottomLeftRadius | 左下边框圆角 | prop | No | Yes | -| borderBottomRightRadius | 右下边框圆角 | prop | No | Yes | -| borderLeft | 左边框 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| borderLeftWidth | 左边框宽度 | prop | No | Yes | -| borderLeftStyle | 左边框样式 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| borderLeftColor | 左边框颜色 | prop | No | Yes | -| borderX | X 轴边框 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| borderY | Y 轴边框 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | +| border | 边框 | prop | no | yes | +| borderWidth | 边框宽度 | prop | no | yes | +| borderStyle | 边框样式 | prop | no | yes | +| borderColor | 边框颜色 | prop | no | yes | +| borderRadius | 边框圆角 | prop | no | yes | +| borderTop | 上边框 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| borderTopWidth | 上边框宽度 | prop | no | yes | +| borderTopStyle | 上边框样式 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| borderTopColor | 上边框颜色 | prop | no | yes | +| borderTopLeftRadius | 上左边框圆角 | prop | no | yes | +| borderTopRightRadius | 上右边框圆角 | prop | no | yes | +| borderRight | 右边框 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| borderRightWidth | 右边框宽度 | prop | no | yes | +| borderRightStyle | 右边框样式 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| borderRightColor | 右边框颜色 | prop | no | yes | +| borderBottom | 下边框 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| borderBottomWidth | 下边框宽度 | prop | no | yes | +| borderBottomStyle | 下边框样式 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| borderBottomColor | 下边框颜色 | prop | no | yes | +| borderBottomLeftRadius | 左下边框圆角 | prop | no | yes | +| borderBottomRightRadius | 右下边框圆角 | prop | no | yes | +| borderLeft | 左边框 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| borderLeftWidth | 左边框宽度 | prop | no | yes | +| borderLeftStyle | 左边框样式 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| borderLeftColor | 左边框颜色 | prop | no | yes | +| borderX | X 轴边框 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| borderY | Y 轴边框 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | **API position** -| Name | Description | Type | Required | HarmonyOS Support | Notes | -| -------- | ------------ | ---- | -------- | -------- | ---------------------------------------- | -| position | 定位 | prop | No | Yes | -| zIndex | 元素堆叠顺序 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| top | 上偏移量 | prop | No | Yes | -| right | 右偏移量 | prop | No | Yes | -| bottom | 下偏移量 | prop | No | Yes | -| left | 左偏移量 | prop | No | Yes | +| Name | Description | Type | Required | HarmonyOS Support | +| -------- | ------------ | ---- | -------- | -------- | +| position | 定位 | prop | no | yes | +| zIndex | 元素堆叠顺序 | prop | no | yes | +| top | 上偏移量 | prop | no | yes | +| right | 右偏移量 | prop | no | yes | +| bottom | 下偏移量 | prop | no | yes | +| left | 左偏移量 | prop | no | yes | **API shadow** -| Name | Description | Type | Required | HarmonyOS Support | Notes | -| ---------- | -------- | ---- | -------- | -------- | ---------------------------------------- | -| textShadow | 文本阴影 | prop | No | Yes | -| boxShadow | 盒子阴影 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | +| Name | Description | Type | Required | HarmonyOS Support | +| ---------- | -------- | ---- | -------- | -------- | +| textShadow | 文本阴影 | prop | no | yes | +| boxShadow | 盒子阴影 | prop | no | yes | **API background** | Name | Description | Type | Required | HarmonyOS Support | Notes | | ------------------ | ---------- | ---- | -------- | -------- | ---------------------------------------- | -| backgroundImage | 背景图片 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| backgroundSize | 背景尺寸 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| backgroundPosition | 背景定位 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | -| backgroundRepeat | 背景图平铺 | prop | No | Yes | 与 android、ios 效果一致，设置后均无效果 | +| backgroundImage | 背景图片 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| backgroundSize | 背景尺寸 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| backgroundPosition | 背景定位 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | +| backgroundRepeat | 背景图平铺 | prop | no | yes | 与 Android、iOS 效果一致，设置后均无效果 | ## 遗留问题