HTML基础标签入门

时间:2022-05-08 20:02:04

HTML基础标签

  昨天学习了一些HTML的基本标签以及基本属性:

  HTML是一种超文本标记语言,其中PHP是世界上最好的语言(增加学习的动力荣誉感)。

  HTML文档里包含三部分:

  <html>——开始标签

    <head> ——网页上的控制信息

      <title>——网页标题

      </title>

    </head>

    <body>

    网页显示的内容

    </body>

   </html>——结束标签

  <!——注释的内容——> 注释

  body的属性:

    background                                   网页背景图片

    bgcolor                                         网页背景颜色

    text                                              文字颜色

    topmargin                                     上页边距

    leftmargin                                     左页边距

    rightmargin                                   右页边距

    bottommargin                               下页边距

  一般标签:

    格式控制标签:

      <font color="" face="" size=""></font>       控制字体;color,字体颜色;face,字体;size,字体大小。

      <b></b>                         字体加粗

      <i></i>                           倾斜

      <u></u>                         下划线

      <strong></strong>          字体加粗(强调,语气加强用)

      <em></em>                   字体倾斜(强调,语气加强用)

      <center></center>          居中

      <br>或</br>                   相当于回车,换行

      &nbsp;                            表示空格

    内容容器标签:

      <h1></h1>......<h6></h6>  标题(会自动换行)。HTML标题(Hesding)是通过<h1>-<h6>等标签进行定义的。

      <p></p>                        段落标签(段落之间空行)

      <div></div>                   层标签(默认占用一行)

      <span></span>              层标签(默认用多大空间占用多大空间)

      <ol type="1/a/A...">     ——有序列表,序号为双引号里面的格式,引号中可以更改序列号形式

        <li>内容<li>

        <li>内容<li>

        <li>内容<li>

      </ol>  ——上面的"ol"变为"ul"则为无序列表

      相对路径:相对于本文档位置;

      绝对路径:直接从哪个盘开始读取。

  常用标签:

    超链接标签

      <a href="超链接的地址" target="blank/self">超链接的文字或者图片</a>

      blank是从一个新网页打开;self是自身网页打开!

      第一步:做锚点的标签。<a name=""></a>

      第二步:做锚点链接。<a href="#目标连接的name的值"></a>

    图片标签

      <img src="图片地址" alt="图片无法显示时出现的文字" title="鼠标指向时现实的文字" width="" height="">  ——高和宽设置一个即可,显示图片会按比例缩放。

  表格标签:

    表格

      <table width="宽度" border="边框" align="对齐方式" background/bgcolor="背景图片/背景色">

        行:

        <tr align="水平对齐方式" valign="垂直对齐方式" height="行高" background/bgcolor="背景图片/背景色">

          单元格:

          <td align="水平对齐方式" valign="垂直对齐方式" width="单元格宽度" height="单元格高度" backgroung/bgcolor="背景图片/背景色">

          </td>

        </tr>

      </table>

align:left   center  right

    valign:top  middle   bottom

    单元格合并:

    colspan="n"       合并同一行单元格(后面写代码要减去相应的列)

    rowspan="n"      合并同一行列单元格(后面写代码要减去相应的列)。

  这就是第一天所学内容,这一部分很简单,试一下就会了。