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

實(shí)現(xiàn)標(biāo)題和文本區(qū)域最常用的是基礎(chǔ)組件 text。text 組件用于展示文本，可以設(shè)置不同的屬性和樣式，文本內(nèi)容需要寫在標(biāo)簽內(nèi)容區(qū)，完整屬性和樣式信息請(qǐng)參考text。在頁(yè)面中插入標(biāo)題和文本區(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.',
  },
}