You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@weex.apache.org by ky...@apache.org on 2018/12/11 09:24:05 UTC
[incubator-weex-site] branch master updated: * [Android] Update doc
for text-style. (#228)
This is an automated email from the ASF dual-hosted git repository.
kyork pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-weex-site.git
The following commit(s) were added to refs/heads/master by this push:
new 21ffe00 * [Android] Update doc for text-style. (#228)
21ffe00 is described below
commit 21ffe009ac76bcfa320fed84c2b176bdb3bd2df7
Author: YorkShen <sh...@gmail.com>
AuthorDate: Tue Dec 11 17:24:00 2018 +0800
* [Android] Update doc for text-style. (#228)
---
source/cn/wiki/text-styles.md | 40 ++++++++++++++++------------------------
source/wiki/text-styles.md | 38 ++++++++++++++++----------------------
2 files changed, 32 insertions(+), 46 deletions(-)
diff --git a/source/cn/wiki/text-styles.md b/source/cn/wiki/text-styles.md
index be91530..89a5d84 100644
--- a/source/cn/wiki/text-styles.md
+++ b/source/cn/wiki/text-styles.md
@@ -10,38 +10,30 @@ version: 2.1
<span class="weex-version">v0.5+</span>
-文本类组件共享一些通用样式, 这类组件目前包括 [`<text>`](/cn/references/components/text.html) 和 [`<input>`](/cn/references/components/input.html)。
+文本类组件共享一些通用样式, 这类组件目前包括 [`<text>`](../references/components/text.html)、[`<input>`](../references/components/input.html)和[`<richtext>`](../references/components/richtext.html)
## 属性
-- `color {color}`：文字颜色。
-
- 可选值为色值，支持 RGB（ `rgb(255, 0, 0)` ）；RGBA（ `rgba(255, 0, 0, 0.5)` ）；十六进制（ `#ff0000` ）；精简写法的十六进制（ `#f00` ）；色值关键字（`red`）。
-
-- `lines {number}`: 指定文本行数。仅在 `<text>` 组件中支持。默认值是 `0` 代表不限制行数。
-
-- `font-size {number}`：文字大小。
-
-- `font-style {string}`：字体类别。可选值 `normal` | `italic`，默认为 `normal`。
-
-- `font-weight {string}`<span class="api-version">v0.9+</span>：字体粗细程度
-
+- `color {color}`：文字颜色，支持如下字段：
+ * RGB（ `rgb(255, 0, 0)` ）
+ * RGBA（ `rgba(255, 0, 0, 0.5)` ）
+ * 十六进制（ `#ff0000` ）；精简写法的十六进制（ `#f00` ）
+ * 色值关键字（`red`）
+* `font-size {number}`：文字大小。
+* `font-style {string}`：字体类别。可选值 `normal` | `italic`，默认为 `normal`。
+* `font-weight {string}`<span class="api-version">v0.9+</span>：字体粗细程度
* 可选值: `normal`, `bold`, `100`, `200`, `300`, `400`, `500`, `600`, `700`, `800`, `900`
* normal 等同于 400, bold 等同于 700；
* 默认值: `normal`；
* iOS 支持 9 种 font-weight值；Android 仅支持 400 和 700, 其他值会设为 400 或 700
* 类似 `lighter`, `bolder` 这样的值暂时不支持
-
-- `text-decoration {string}`：字体装饰，可选值 `none` | `underline` | `line-through`，默认值为 `none`。
-
-- `text-align {string}`：对齐方式。可选值 `left` | `center` | `right`，默认值为 `left`。目前暂不支持 `justify`, `justify-all`。
-
-- `font-family {string}`：设置字体。
-
- 这个设置 **不保证** 在不同平台，设备间的一致性。如所选设置在平台上不可用，将会降级到平台默认字体。
-
-- `text-overflow {string}`：设置内容超长时的省略样式。可选值 `clip` | `ellipsis`
+* `text-decoration {string}`：字体装饰，可选值 `none` | `underline` | `line-through`，默认值为 `none`。
+ >> 只有 `<text>`和`<richtext>`组件支持。
+* `text-align {string}`：对齐方式。可选值 `left` | `center` | `right`，默认值为 `left`。目前暂不支持 `justify`, `justify-all`。
+* `font-family {string}`：设置字体。这个设置 **不保证** 在不同平台，设备间的一致性。如所选设置在平台上不可用，将会降级到平台默认字体。如果需要加载自定义字体，请参考相关[文档](../references/modules/custom_font.html)。
+* `text-overflow {string}`：设置内容超长时的省略样式。可选值 `clip` | `ellipsis`
+ >> 只有 `<text>`和`<richtext>`组件支持。
+* `lines {number}`: 正整数，指定最大文本行数，默认值为0，表示不限制最大行数。如果文本不够长，实际展示行数会小于指定行数。
## 其它参考
-
- [颜色关键字列表](./color-names.html)。
diff --git a/source/wiki/text-styles.md b/source/wiki/text-styles.md
index f7f0cd9..1cb5c8d 100644
--- a/source/wiki/text-styles.md
+++ b/source/wiki/text-styles.md
@@ -8,11 +8,19 @@ version: 2.1
<!-- toc -->
-Text alike components share some common style rules. The text alike components currently includes [`text`](/references/components/text.html) and [`input`](/references/components/input.html).
+Text alike components share some common style rules. The text alike components currently includes [`text`](../references/components/text.html)、[`input`](../references/components/input.html) and [`richtext`](../references/components/richtext.html)
## Properties
- `color`: <colors> this property set the foreground color of an component's text content.
+ * The property `color` support multiple formats of values, contains rgb, rgba, #fff, #ffffff, named-color. Example:
+ ```css
+ .my-class { color: red; }
+ .my-class { color: #f00; }
+ .my-class { color: #ff0000; }
+ .my-class { color: rgb(255, 0, 0); }
+ .my-class { color: rgba(255, 0, 0, 0.5); }
+ ```
- `font-size`: <length> this property specifies the size of the font.
- `font-style`: <enum> `normal` | `italic`. This property lets you select italic or normal faces within a font-family. Default value is `normal`.
- `font-weight`<span class="api-version">v0.9+</span>:
@@ -25,27 +33,13 @@ Text alike components share some common style rules. The text alike components c
* Some standard values like `lighter`, `bolder`, number unit are not supported.
* The effect not apply to all elements, just `<text>` and `<input>`. In another way, it's not inherited.
- `text-decoration`: <enum> `none` | `underline` | `line-through`. This property is used to set the text formatting to underline or line-through. The default value is `none`.
+ >> Only support for `<text>` and `<ricthext>`
- `text-align`: <enum> `left` | `center` | `right`. This property describes how inline content like text is aligned in its parent component. The default value is `left`.
-- `font-family`:<string> this property set the font-family of the text. This property **doesn't guarantee** the given font will always be set to the text. If the specified font cannot be found at the device, a typeface fallback will occur and the default typeface will be load. The fallback mechanism may vary in different devices.
-- `text-overflow`:<string> `clip` | `ellipsis`. This property determines how overflowed content that is not displayed is signaled to users. It can be clipped, display an ellipsis.
+- `font-family`:<string> this property set the font-family of the text. This property **doesn't guarantee** the given font will always be set to the text. If the specified font cannot be found at the device, a typeface fallback will occur and the default typeface will be load. The fallback mechanism may vary in different devices. If you want load your own font-family, ref [custom-font](../references/modules/custom_font.html) instead.
+- `text-overflow`:<enum> `clip` | `ellipsis`. This property determines how overflowed content that is not displayed is signaled to users. It can be clipped, display an ellipsis.
+ >> Only support for `<text>` and `<ricthext>`
+- `lines`: <number> positive number. This is the max lines of text that would be displayed, the default value is 0 which means there is no restriction on text lines. If the text is not enough, the actual number of line may be shorter than the specified value.
-The property `color` support multiple fomats of values, contains rgb, rgba, #fff, #ffffff, named-color.
-
-Example:
-
-```css
-.my-class { color: red; }
-.my-class { color: #f00; }
-.my-class { color: #ff0000; }
-.my-class { color: rgb(255, 0, 0); }
-.my-class { color: rgba(255, 0, 0, 0.5); }
-```
-
-## Type of Style Value
-
-- length: number followed by length unit `px`, `px` can be omitted.
-- colors: support multiple formats of values, including rgb (`rgb(255, 0, 0)`), rgba (`rgba(255, 0, 0, 0.5)`), hexadecimal (`#ff0000`), short hexadecimal (`#f00`), named color (`red`).
-- enumerated values: a limited number of string values.
-
-**Note:** [The list of color keywords.](./color-names.html)
+## Note
+* [The list of color keywords.](./color-names.html)