HTML基础 | 青训营笔记

75 阅读2分钟

这是我参与「第四届青训营 」笔记创作活动的的第1天

今天主要学习了HTML的基础知识,前端主要的标签,原来还有那么多标签

前端技术栈主要分三层
html,css,JavaScript通过HTTP与服务器端连接

html标签是根标签,所有信息都放在里面的 body标签就是我们要显示的内容

HTML语法:
  • 标签和属性不区分大小写,推荐小写
  • 空标签可以不闭合,比如input、meta
  • 属性值推荐用双引号包裹
  • 某些属性值可以省略,比如required、readonly

h1表示一级标题

h2表示2级标题,后面以此类推

列表: 有序列表用ol标签,无序列表用ul标签,定义列表

多媒体标签

图片:img; 音频:audio; 视频:video

输入表单类标签

  • 基本
  • 输入范围
  • 输入数字,可设定最大最小值
  • 输入日期
  • 输入多行文本
  • 多项选择输入
  • 单项选择输入
  • 下拉选择输入
  • 提示文本输入
在标签中还有引用,对于不同的引用有不同的标签,以前我只用p标签现在也算是一种查漏补缺

blockquote快捷引用,引用一段话

cite短引用,短短的引用,作品或作者等的引用

q标签标识前文引用的

code代码标签,可长可短的代码,一般会在外面放一个pre的标签设置格式

强调标签

strong标签,含义上的标签表示非常重要的事

em标签,表示在一句话里面突出表示的词

在页面中我们前端的部分可以用内容划分

header标签表示页面的头部,放介绍性和引导性的内容

main标签表示页面的主体

aside侧边栏,与内容相关但不是属于正文,相关内容的推荐,导航链接等

footer表示页面的底部,一般放一些参考链接,版权信息

对于语义化,这是我第一次接触到到的含义了解语义化后会对我以后写代码还是有很大的帮助

有序列表用ol,无序列表用ul,lang属性表示内容所使用的的语言 语义化的好处:可读性和可维护性,无障碍性