ColorUI/pages/text/text.wxml

<view class="bar solid-bottom">
  <view class='ml-sm'>
    <text class='iconfont icon-titles success-text'></text>
    <text class='text-lg ml-xs'>字号</text>
  </view>
</view>
<view class="doc-main">
  <view class="flex doc-box p-df flex-direction">
    <view class="text-{{item.name}}" wx:for="{{size}}" wx:key="{{index}}">死亡如风，常伴吾身。</view>
  </view>
</view>
<view class="bar solid-bottom mt-sm">
  <view class='ml-sm'>
    <text class='iconfont icon-titles success-text'></text>
    <text class='text-lg ml-xs'>文字截断</text>
  </view>
</view>
<view class="doc-main">
  <view class="flex doc-box p-df flex-direction">
    <view class="text-truncate" style="width:500rpx">双眼失明并不影响我追杀敌人,因为我能闻到他身上的臭味!</view>
  </view>
</view>
<view class="bar solid-bottom mt-sm">
  <view class='ml-sm'>
    <text class='iconfont icon-titles success-text'></text>
    <text class='text-lg ml-xs'>文字对齐</text>
  </view>
</view>
<view class="doc-main">
  <view class="flex doc-box p-df flex-direction text-left">
    <view>我是风中的余烬。</view>
    <view>破釜沉舟，困兽犹斗。</view>
    <view>愤怒在积攒！</view>
    <view>混沌，不在乎你的眼泪。</view>
  </view>
  <view class="flex doc-box mv-sm p-df flex-direction text-center">
    <view>宇宙，在颤抖的等待。</view>
    <view>战斗，是我的宿命。</view>
    <view>迫不得已之时应无怨无悔</view>
  </view>
  <view class="flex doc-box p-df flex-direction text-right">
    <view>于是，我就成了黑暗。</view>
    <view>和谐是谎言，从者为奴隶。</view>
    <view>光明不懂救赎，她只懂征服。</view>
  </view>
</view>
<view class="bar solid-bottom mt-sm">
  <view class='ml-sm'>
    <text class='iconfont icon-titles success-text'></text>
    <text class='text-lg ml-xs'>文字颜色</text>
  </view>
</view>
<view class="doc-main">
  <view class="flex doc-box p-df flex-direction">
    <view class="grays-text">夜晚越黑暗 星星就越明亮!</view>
    <view class="gray-text">规则就是用来打破的!</view>
    <view class="danger-text">断剑重铸之日，骑士归来之时!</view>
    <view class="success-text">哼，一个能打的都没有!</view>
    <view class="warning-text">永远不要忘记，吾等为何而战!</view>
    <view class="primary-text">我去前面探探路!</view>
    <view class="secondary-text">一轮新月正在冉冉升起!</view>
    <view class="purple-text">来！炸个痛快!</view>
    <view>取经才是重中之重!</view>
  </view>
</view>