Weex第一天:文本样式

938 阅读2分钟

文本一样的组件共享一些共同的样式规则。文本类似的组件目前包括text和input。

属性

  • color:此属性设置组件的文本内容的前景色。
  • font-size:这个属性指定了字体的大小。
  • font-stylenormal| - italic。该属性允许您在字体系列中选择斜体或正常面。默认值是normal
  • font-weight
    • 值:normal,bold,100,200,300,400,500,600,700,800,900
    • 正常等于400,大胆等于700
    • 默认值: normal
    • 适用于:<text>,<input>
    • ios支持显示9种字体重量。
    • Android支持显示2种字体重量:400,700,其他值将映射到400或700
    • 一些标准值,如lighter,bolder数字单位不被支持。
    • 效果不适用于所有元素,只是<text>和<input>。换句话说,它不是继承的。
  • text-decorationnone| underline| line-through。此属性用于将文本格式设置为下划线或直通。默认值是none
  • text-alignleft| center| right。这个属性描述了像文本这样的内联内容如何在其父组件中对齐。默认值是left
  • font-family:这个属性设置文本的font-family。此属性不保证给定的字体将始终设置为文本。如果在设备上找不到指定的字体,则会出现字体回退,缺省字体将被加载。回退机制可能会因不同的设备而有所不同。
  • text-overflowclip| ellipsis。这个属性决定了如何溢出的内容没有被显示给用户。它可以被剪切,显示一个省略号。

该属性color支持多个值的格式,包含rgb,rgba,#fff,#ffffff,named-color。

.my-class { color:red; } 
.my-class { color:#f00 ; } 
.my-class { color:#ff0000 ; } 
.my-class { color:rgb(25500); } 
.my-class { color:rgba(255000.5); }

样式值的类型

  • 长度:数字后跟长度单位px,px可以省略。
  • 颜色:支持多种格式的值,包括rgb(rgb(255, 0, 0)),rgba(rgba(255, 0, 0, 0.5)),十六进制(#ff0000),十六进制(#f00),命名的颜色(red)。 枚举值:有限的字符串值。