002 | HTML

表格

表格由 <table> 标签来定义。每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由 <td> 标签定义)。字母 td 指表格数据(table data),即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。

表格实例
<html>

  <body>

    <p>每个表格由 table 标签开始。</p>
    <p>每个表格行由 tr 标签开始。</p>
    <p>每个表格数据由 td 标签开始。</p>

    <h4>一列:</h4>
      <table border="1">
        <tr>
          <td>100</td>
        </tr>
      </table>

    <h4>一行三列:</h4>
      <table border="1">
        <tr>
          <td>100</td>
          <td>200</td>
          <td>300</td>
        </tr>
      </table>

    <h4>两行三列:</h4>
      <table border="1">
        <tr>
          <td>100</td>
          <td>200</td>
          <td>300</td>
        </tr>
        <tr>
          <td>400</td>
          <td>500</td>
          <td>600</td>
        </tr>
      </table>

  </body>
</html>

<div>,<span>

可以通过 <div><span> 将 HTML 元素组合起来。

HTML 块元素

大多数 HTML 元素被定义为块级元素或内联元素。(编者注:“块级元素”译为 block level element,“内联元素”译为 inline element。)
块级元素在浏览器显示时,通常会以新行来开始(和结束)。
例子:<h1>, <p>, <ul>, <table>

HTML 内联元素

内联元素在显示时通常不会以新行开始。
例子:<b>, <td>, <a>, <img>


<div>
HTML<div> 是块级元素,它是可用于组合其他HTML元素的容器。
<div> 可定义文档中的分区或节(division/section)。
<div> 标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具,并且不使用任何格式与其关联。
如果用 id 或 class 来标记 <div>,那么该标签的作用会变得更加有效。
<div>元素没有特定的含义。除此之外,由于它属于块级元素,浏览器会在其前后显示折行。如果与 CSS 一同使用,<div> 元素可用于对大的内容块设置样式属性。
<div> 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用 <table> 元素进行文档布局不是表格的正确用法。<table> 元素的作用是显示表格化的数据。

用法
<div> 是一个块级元素。这意味着它的内容自动地开始一个新行。实际上,换行是 <div> 固有的唯一格式表现。可以通过 <div> 的 class 或 id 应用额外的样式。

不必为每一个 <div> 都加上类或 id,虽然这样做也有一定的好处。

可以对同一个 <div> 元素应用 class 或 id 属性,但是更常见的情况是只应用其中一种。这两者的主要差异是,class 用于元素组(类似的元素,或者可以理解为某一类元素),而 id 用于标识单独的唯一的元素。
实例

<div style="color:#00FF00">
  <h3>This is a header</h3>
  <p>This is a paragraph.</p>
</div>

<span>
HTML<span> 元素是内联元素,可用作文本的容器。<span> 元素也没有特定的含义。当与 CSS 一同使用时,<span> 元素可用于为部分文本设置样式属性。

<p><span>some text.</span>some other text.</p>

如果不对 span 应用样式,那么 span 元素中的文本与其他文本不会任何视觉上的差异。尽管如此,上例中的 span 元素仍然为 p 元素增加了额外的结构。
可以为 span 应用 id 或 class 属性,这样既可以增加适当的语义,又便于对 span 应用样式。
可以对同一个 <span> 元素应用 class 或 id 属性,但是更常见的情况是只应用其中一种。这两者的主要差异是,class 用于元素组(类似的元素,或者可以理解为某一类元素),而 id 用于标识单独的唯一的元素。

猜你喜欢

转载自blog.csdn.net/zljiaa/article/details/81711403
002