阿飞飞飞

学而时习之

导航

HTML基础标签

什么是HTML基础标签?

  HTML指的是一种超文本标记语言(HyperText Markup Language),它不同于java的解释执行,可以一边解释一边执行。

  标签的类型通常分为自闭合和对标签两种,标签种类繁多,实用标签具体有以下几种:

文本
        h标签
        p标签
        em标签、strong标签、b标签、i标签
        span标签
        div标签

链接
        a标签
        img标签

列表,表格
        ul标签、ol标签、li标签
        dl标签、、dt标签、dd标签
        table标签、tr标签、th标签、td标签        

  

而从标签的结构上分的话,可以分为以下几种:

一、结构类型

<html>

  <head>

    <meta charset="UTF-8"/>

    <title>xxx</title>

  </head>

  <body>

    ...

  </body>

</html>

二、基础类型
1、行级标签

  行级标签按行显示,没有宽高,其内容定其真实大小

a标签是用的最广的行级标签

  <a target="显示的方式" href="地址">提示内容</a>

  target:有四种情况

    <1>_self 覆盖当前窗口

    <2>_blank 打开新窗口

    <3>_parent 覆盖父窗口

    <4>frameName 指定框架内显示

  href:目标页面地址

  title:悬窗提示文本

其他文本行级标签

  <span></span>

  </br>

  </hr>

  <strong></strong>

  <em></em>

2、行内块级标签

  按行显示,有默认宽高也可以设置宽高

表单(form)

  <form method="GET/POST" action="后台" enctype="">

  ...

  </form>

  method:

    GET:显示提交

    POST:隐式提交

  action:后台方法的别名

  enctype:各种类型的数据

表单元素主要包括以下几种:

  <input type="" name="" id="" value=""/>

  type的类型繁多,主要有以下几种:

  text      文本框

  password    密码框

  radio      单选按钮

  checkbox    复选框

  number     数字框

  date      日期

  email      邮箱框

  tel       电话框

  range      滑条

  file      文件域

 

  <select name="">  下拉列表

    <option value=""></option>

        ...

  </select>

 

  <textarea name="">...</textarea>  多行文本域

 

  <button type=""></button>    按钮

  type:

    submit    提交按钮

    reset    重置按钮

    button    普通按钮

    diabled   禁用按钮

非表单元素

<img src="" alt="">

  src:图片的地址

  alt:替换文本

 

<video>

  <sourcesrc="" type="video/mp4" />

</video>

 

<audio>

  <source src="" type="audio/mp4" />

</audio>

 

3、块级标签

<1>标题标签

  <h1></h1>
    ...
  <h6></h6>

<2>列表标签

  无序标签

    <ul>
      <li>...</li>
    </ul>
  有序标签
    
<ol>
      <li>...</li>
    </ol>
  
定义标签
    <dl>
      <dt>...</dt>
      <dd>...</dd>
    </dl>


  H5块(标签)
    header
    foot
    aside
    nav
    ariticle
    section

 

posted on 2020-06-20 22:19  阿飞飞飞  阅读(148)  评论(0编辑  收藏  举报