HTML基础标签汇总

本文详细介绍了HTML中的各种标签,包括段落、换行、文本格式化、块与行内元素、图像、超链接、特殊字符、表格、列表、表单结构、表单域元素(如input、文本框、密码框、单选/复选框、button和文件域)以及算法相关的内容,适合前端开发者深入学习。
摘要由CSDN通过智能技术生成

段落标签

  • 可以把HTML文档文档分割为若干段落

  • 文本在一个段落这种会根据浏览器窗口的大小进行自动换行

3.换行标签


  • <br /> 是个单标签

  • <br /> 标签只是简单的开始新的一行,跟段落不一样,段落之间会插入一些垂直的间距

4.文本格式化标签

用于为文字设置粗体斜体下划线等效果

| 语义 | 标签 |

| — | — |

| 加粗 | <strong></strong> |

| 倾斜 | <em><em> |

| 删除线 | <del></del> |

| 下划线 | <ins></ins> |

5.盒子标签

我是一个块元素

我是一个行内元素

  • <div></div>一行只能放一个

  • <span></span>一行可以放多个

6.图像标签

AcWing

| 属性 | 属性值 | 说明 |

| — | — | — |

| src | 图片路径 | 必须属性 |

| alt | 文本 | 替换文本(当图片不能显示时候显示的文字) |

| title | 文本 | 提示文本(鼠标放到图像上,显示的文字) |

  • src<img>标签的必须属性,它用于指定图像文件的路径和文件

7.超链接标签

AcWing

| 属性 | 作用 |

| — | — |

| href | 用于指定链接目标的url地址,是必须属性 |

| target | 用于指定连接页面的打开方式,_self为默认值,_blank为在新窗口中打开 |

8.特殊字符

| 特殊字符 | 描述 | HTML代码 |

| — | — | — |

| | 空格号 | &nbsp; |

| < | 小于号 | &lt; |

| > | 大于号 | &gt; |

| & | 和号 | &amp; |

| | 引号 | &quot; |

| ® | 已注册 | &reg; |

| © | 版权 | &copy; |

  • 空格小于号大于号 这三个符号较为常用

9.表格标签

姓名 性别 年龄 张三 男 15 李四 男 15 王五 男 15
  • table 用来定义表格的标签

  • th 用来定义表格中的表头,表头单元格里面的内容加粗居中显示

  • tr 用来定义表格中的,必须嵌套在<table></table> 标签中

  • td 用来定义表格中的单元格,必须嵌套在<tr></tr> 标签中

10.列表标签

| 标签名 | 定义 | 说明 |

| — | — | — |

| <ul></ul> | 无序列表 | 里面只能包含li,没有顺序,li里面可以包含任何标签 |

| <ol></ol> | 有序列表 | 里面只能包含li,有顺序 |

| <dl></dl> | 自定义列表 | 里面只能包含dtdddtdd里面可以放任何标签 |

    • 无序标签
    • 无序标签
    • 无序标签
      1. 有序标签
      2. 有序标签
      3. 有序标签
      4. 自定义标签
        自定义标签
        自定义标签

        11.表单标签

        一个完整的表单通常由表单域表单控件(表单元素)和提示信息3部分组成

        1. 表单域

        • 表单域是一个包含表单元素的区域

        • <form></from>标签用于定义表单域,会把它范围内的表单元素信息提交给服务器

        | 属性 | 属性值 | 作用 |

        | — | — | — |

        | action | url地址 | 用于指定接收并处理表单数据的服务器程序的url地址 |

        | method | get/post | 用于设置表单数据的提交方式,其取值为getpost |

        | name | 名称 | 用于指定表单的名称,以区分同一个页面中的多个表单域 |

        2.表单元素

        ①input输入表单元素

        input是个单标签,type 属性设置不同的属性用来指定不同的控件类型(文本字段、复选框、单选按钮、按钮等)

        在这里插入图片描述

        <input> 标签的一些其他常用属性

        在这里插入图片描述

        • namevalue是每个表单元素都有的属性值,主要给后端人员使用

        • name 是表单元素的名字,要求单选框和复选框要有相同name

        • checked 属性主要针对于单选框和复选框,主要作用是一打开页面,就可以默认选中某个表单元素

        ②文本框与密码框

        账号:

        密码:

        • type 属性设置为text文本框

        • type 属性设置为 password密码框

        ③单选框和复选框

        性别:男 女

        选课:物理 化学 生物

        • type 属性设置为 radio单选框

        • type 属性设置为 checkbox复选框

        • name是表单元素的名字,要求 单选框和复选框要有相同的name值

        ④button和文件域


        上传文件:

        • type 属性设置为button:是一个按钮

        • type 属性设置为file:是一个文件域,可以上传文件

        ⑤label

        总结

        三套“算法宝典”

        开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

        28天读完349页,这份阿里面试通关手册,助我闯进字节跳动

        算法刷题LeetCode中文版(为例)

        人与人存在很大的不同,我们都拥有各自的目标,在一线城市漂泊的我偶尔也会羡慕在老家踏踏实实开开心心养老的人,但是我深刻知道自己想要的是一年比一年有进步。

        最后,我想说的是,无论你现在什么年龄,位于什么城市,拥有什么背景或学历,跟你比较的人永远都是你自己,所以明年的你看看与今年的你是否有差距,不想做咸鱼的人,只能用尽全力去跳跃。祝愿,明年的你会更好!

        由于篇幅有限,下篇的面试技术攻克篇只能够展示出部分的面试题,详细完整版以及答案解析,有需要的可以关注

      • 21
        点赞
      • 26
        收藏
        觉得还不错? 一键收藏
      • 0
        评论

      “相关推荐”对你有帮助么?

      • 非常没帮助
      • 没帮助
      • 一般
      • 有帮助
      • 非常有帮助
      提交
      评论
      添加红包

      请填写红包祝福语或标题

      红包个数最小为10个

      红包金额最低5元

      当前余额3.43前往充值 >
      需支付:10.00
      成就一亿技术人!
      领取后你会自动成为博主和红包主的粉丝 规则
      hope_wisdom
      发出的红包
      实付
      使用余额支付
      点击重新获取
      扫码支付
      钱包余额 0

      抵扣说明:

      1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
      2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

      余额充值