课程设计记录Day1 HTML中的一些标签

1.前端中的编辑器

1.1 HBuilder 前端开发中不是特别常用 打包H5的APP非常方便
1.2 VScode 用JavaScript编写的一款编辑器，专业编写前端代码的，目前来说前端开发中使用频率最高的
1.3 webstorm 非常老的前端编辑器。早期的时候非常多的前端开发者使用，但是vscode出来以后，大致在2018.基本都转成vscode
1.4 sublime 综合型的轻量编辑器，很多开发者喜欢使用

2.HTML 超级 文本 标记 语言

HTML中全部是由标记（标签，元素）组成的。html是以.html结尾的。

2.1 标签按照书写形式划分： 单标签 双标签
2.2 html中的注释 Ctrl /⌘+/
2.3 html中的属性 多个属性用空格进行分隔
2.4 浏览器器对于文本中的空格和换行的解析： 所有的’连在一起’的空格和换行全部会被浏览器解析成一个空格
2.4.1 使用空格： &nbsp; 一个表示一个空格
2.4.2 使用换行： 换行使用的是一个标签 ： <br> 单标签，写一个表示换一行
2.5 HTML中的一些标签
HTML中的内容几乎都是由标签组成的，所有的内容都是放在标签内容的
标签都是有自己对应的展现的形式的
2.5.1 i 双标签 放在中间的文本是斜体
2.5.2 b 双标签 加粗
2.5.3 s 双标签 删除线
2.5.4 u 双标签 下划线
以上这些标签都是可以嵌套的，并且没有嵌套的顺序的区分
2.5.5 font 双标签 size属性：1-7 表示文本的大小 color属性：设置字体的颜色 这个标签也是可以和上面的标签进行嵌套的
2.5.6 sub 双标签 下标
2.5.7 sup 双标签 上标
2.5.8 hr 单标签 一条分隔线 width 表示线条的宽度 align属性：表示线条的对齐方式，默认为居中（center） size属性：线条的粗细，取值1-7 color属性：线条的颜色
2.5.9 span 双标签 没有任何的展现的样式部分
2.5.10 div 双标签 没有任何的展现的样式部分
2.5.11 h1,h2,h3,h4,h5,h6 双标签 标题标签 文本加粗，字体变大的效果 align属性：对齐方式，默认为左对齐（left）
2.5.12 pre 双标签 文本预格式标签 保留标签文本中的所有空格和换行，如果需要大量使用空格和换行，可以考虑使用该标签
2.5.13 表格标签 一套标签 table tr td th tbody thead tfoot caption 这一套不一定都能用的上，如果使用表格，常用的就是table tr td th可能会用一点
表格一定的是工整的，第一行有几个单元格，后面的行必须有对应的单元格。
table表格的最大的标签，里面所有标签都必须嵌套在table标签中 border属性：表格的边框 width属性：表格的宽度 height属性：表格的高度 align属性：表格的对齐方式 bgcolor属性
cellpadding属性 表示的是文本到单元格边框的距离 cellspacing属性：单元格与单元格之间的距离
注意：一般的情况，设置了宽高，就不会去设置间距
tr标签 表示行
align：当前行的文本的对齐方式
valign：当前行文本的竖直对齐方式 bgcolor属性
td标签 表示单元格
align：当前单元格文本的对齐方式，优先级比tr中的align高
valign：当前单元格的竖直对齐方式，优先级比tr中valign高 bgcolor属性
colspan 跨列
rowspan 跨行
th标签 表示单元格 自带加粗和居中的效果的，属性和td标签一致
thead tbody tfooter 表格的区域划分，一般很少使用
表格的合并（不规则的表格）
2.5.14 表单标签 一套标签 form input select … 脱离表单标签自行存在，表格中的tr td是不能脱离table。 没有样式的。但是有功能：提交的功能。目前不需要关注功能，功能是像后端去发送请求的。
form标签 其他的标签可以脱离form独立存在的。 action属性：需要向后端去提交数据的地址。 method属性:向后端传递数据的一种形式 目前action几method不需要去理会
input标签 单标签 可以控制type属性让其展示对应的形式 value属性：表示默认值 placeholder属性：文本占位符 适用于type=text或者password的时候好用
type属性取值： text普通的文本框 password密码框 radio单选框（一组单选框必须含有相同的name属性值） checkbox复选框（一组复选框必须包含相同的name属性值） button按钮（配合value属性一起使用） reset重置，重置表单
select标签+option标签 option作为select的子集，表示里面具体的每一项
textarea标签 少量的文本可以使用inputtype=text ，大量的文本就可以使用该标签
2.5.15 列表标签
有序列表 ： 组合标签 ol+n个li嵌套的形式 在实际的开发中，有序列表基本上不怎么用
ol有序列表的父标签 type属性：1，a，A，i，I 。 start属性：表示从什么地方开始
li列表中的子项，可以有N个
无序列表 ： 组合标签 ul+n个li嵌套的形式 在实际的开发中，无序列表占标签中的大头 导航的菜单，内容部分…
ul无序列表的父标签 type属性：三种 因为是无序的，start属性就没有什么意义
li列表中的子项，可以有N个