鴻蒙OS 添加標題行和文本區(qū)域

實現(xiàn)標題和文本區(qū)域最常用的是基礎(chǔ)組件 text。text 組件用于展示文本，可以設置不同的屬性和樣式，文本內(nèi)容需要寫在標簽內(nèi)容區(qū)，完整屬性和樣式信息請參考text。在頁面中插入標題和文本區(qū)域的示例如下：

<!-- xxx.hml -->
<div class="container">
  <div class="left-container">
    <text class="title-text">{{headTitle}}</text>
    <text class="paragraph-text">{{paragraphFirst}}</text>
    <text class="paragraph-text">{{paragraphSecond}}</text>
  </div>
</div>

/* xxx.css */
.container {
  margin-top: 24px;
  background-color: #ffffff;
}
.left-container {
  flex-direction: column;
  margin-left: 48px;
  width: 460px;
}
.title-text {
  color: #1a1a1a;
  font-size: 36px;
  height: 90px;
  width: 400px;
}
.paragraph-text {
  color: #000000;
  margin-top: 12px;
  font-size: 20px;
  line-height: 30px;
}

// xxx.js
export default {
  data: {
    headTitle: 'Capture the Beauty in This Moment',
    paragraphFirst: 'Capture the beauty of light during the transition and fusion of ice and water. At the instant of movement and stillness, softness and rigidity, force and beauty, condensing moving moments.',
    paragraphSecond: 'Reflecting the purity of nature, the innovative design upgrades your visual entertainment and ergonomic comfort. Effortlessly capture what you see and let it speak for what you feel.',
  },
}