📜  nx 使用标签绘制 (1)

📅  最后修改于: 2023-12-03 15:18:04.472000             🧑  作者: Mango

使用标签绘制

nx 中,标签是一种常用的元素,用于向页面添加结构和样式。本篇文章将介绍如何使用标签绘制页面。

基本标签

以下是常见的基本标签:

标题标签

标题标签用于添加标题。

<h1>这是一级标题</h1>
<h2>这是二级标题</h2>
<h3>这是三级标题</h3>
<h4>这是四级标题</h4>
<h5>这是五级标题</h5>
<h6>这是六级标题</h6>
段落标签

段落标签用于添加段落。

<p>这是一个段落。</p>
列表标签

列表标签用于添加有序或无序列表。

<ul>
  <li>无序列表项1</li>
  <li>无序列表项2</li>
</ul>

<ol>
  <li>有序列表项1</li>
  <li>有序列表项2</li>
</ol>
超链接和图片
超链接

超链接标签用于添加超链接。

<a href="https://www.google.com/">点击这里访问 Google</a>
图片

图片标签用于添加图片。

<img src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" alt="Google Logo" />
表格

表格标签用于添加表格。

<table>
  <thead>
    <tr>
      <th>名称</th>
      <th>价格</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>商品1</td>
      <td>10 元</td>
    </tr>
    <tr>
      <td>商品2</td>
      <td>20 元</td>
    </tr>
  </tbody>
</table>
表单

表单标签用于添加表单。

<form>
  <div>
    <label for="name">姓名:</label>
    <input type="text" id="name" name="name" />
  </div>
  <div>
    <label for="email">邮箱:</label>
    <input type="email" id="email" name="email" />
  </div>
  <div>
    <label for="message">留言:</label>
    <textarea id="message" name="message"></textarea>
  </div>
  <div>
    <button type="submit">提交</button>
  </div>
</form>
结语

以上是一些常见的标签和用法,当然还有很多其他的标签,可以根据自己的需要进行使用。为了更好地展示标签,可以使用 CSS 进行样式的美化。