这是我参与「第四届青训营 」笔记创作活动的的第1天
前端技术栈
HTML写出网页的内容
CSS定义网页的样式
JavaScript定义网页的行为
三者结合通过网络协议与服务器端进行交互
HTML语法：
- 标签和属性不区分大小写，推荐小写
- 空标签可以不闭合，如input，meta
- 属性值用双引号包括
- 某些属性值可以忽略
常用标签
标题h1-h6
h1表示1级标题， h2表示2级标题……h6表示6级标题
有序列表标签ol
即ordered list
其中的每一个列表项前加li
如
电影排行
- 阿凡达
- 复仇者联盟
无序列表标签 ul
即 unordered list
其中的每一个列表项前加li
如
购物清单
- 水果
dl 定义类型列表
属性名加属性值
dt表示属性名，dd表示属性名中具体描述，dt与dd是多对多的关系。
a标签
属性
-
href
-
target
-
download 下载页面，很多浏览器不支持
-
rel=noopener 作用
-
跳转外部页面
-
跳转内部锚点
-
跳转到邮箱或电话等 href取值
-
所连接网页的地址
-
路径
-
伪协议
-
id
- href=#xxx
- 跳转到带有id的元素 target
内置名字
- _blank 在空白窗口打开
- _top 在顶层窗口打开
- _parent 在上一层窗口打开
- _self 当前窗口打开
多媒体元素
img标签
-
src 是多媒体文件的地址
-
alt 是图片加载失败后替代性的文本
-
width 是图片展示的宽度
audio标签
- src 仍是音频的地址
- control 显示播放控制按键
video标签
- src 仍是视频的地址
- control 显示播放控制按键
input 标签
作用 ：让用户输入内容
placeholder 占位符 它的值显示未输入时文本框显示的内容
类型
- range 表示一个可拖动的范围
- number 表示数字可设置最大最小值
- data 日期
- textarea 可进行多行输入的文本框
- checkbox 在已有选项中选一个或多个 如
- radio 在已有选项中选一个 其互斥关系通过 name属性的值来判断，相同name只能选择一个
select标签表示下拉选择
文本类标签
引用
blockquote 长引用 表示引用一段话 其cite表示这段话的原地址
cite 短引用 一个词一个名字 作品名字或章节
q 短引用 一句话具体的内容 表现形式为双引号
code 表示代码
pre标签表示引用多行代码
strong 标签 表示强调，事情严重紧急 表现为粗体
em 标签 表示强调，语气强调，表现为斜体
内容划分
header
可放logo，nav（导航）
main
网页的主要内容
其中正文可放入article中
也可以没有article 标签 直接全文输出
aside
相关推荐等等
语义化
对于不同的内容要用相对应合适的标签
HTML是传递的内容，而非形式
