前端学习笔记DAY01

前端学习日记（记录从不会玩电脑小白到大神的过程）：

（目标：2021年2月14日开始学习HTML，半个月拿下HTML+css基础。初心：记录个人学习成长，欢迎大神指点。）

一、基本语法记录：

1、基本标签

1、标题标签< h1 >和< h6 >

解释：共6个等级 ；作为标题使用，重要性依次递减。
特点：1、加了标题文字会变粗，字号变大 2、一个标题独占一行 。
记忆：单词head的缩写，意思为头部、标题。
用法：< h1 >一级标题< /h1 >

2、段落标签< p > < /p >

解释：网页中文字分段显示，在HTML中用于定义段落，可把网页分为若干段落。
记忆：program的缩写，意味段落。
特点：1、会根据浏览器窗口大小自动换行 2、段落和段落间有空隙。
用法：< p >段落标签< /p >

3、换行标签< br/ >

解释：网页中文字从左到右依次排列,到浏览器窗口右端才会自动换行，此命令能够实现随心所欲的换行。
记忆：break的缩写，意味打断、换行
特点：1、单标签 2、另起一行无间距
用法：此处需要换行< br/ >

4、< div >< /div >和< span >< /span >

解释：无语义，盒子用来装内容
记忆：div是division的缩写表示分割、分区，span意味跨度、跨距。
特点：< div > 用来布局，一行只能放一个< div >,大盒子 2、span用来布局，一行可以放多个，小盒子。

5、< img src=“图片位置”/ >

解释：网页中添加图片
记忆：image的缩写，意味图像。
特点：1、src 是img的必须属性，指定图像文件路径和文件名。2、单标签
其他属性：
用法：无特殊用法，注意：属性中间用空格间隔；一般只设置宽度或者长度；

6、根目录与路径

根目录解释：打开目录文件夹的第一层就是根目录
相对路径：简单说图片相对于HTML文件的位置，分为三类：
1、同级目录 2、下级目录 符号： / 3、上级目录 符号： …/
绝对路径：在电脑路径中的位置

7、超链接标签< a herf="" > 内容< /a >

属性：herf 存放链接地址 target ：链接打开方式，_self默认值，_blank为新窗口打开方式

8、链接分类

9、注释标签< !-- 这是注释 - - >

10、表格标签< table > < tr > < td >< /td >< / tr> < /table >

学习投资时间	回报率	兴趣程度	期望薪资
100天	80%	70%	15K

表格标签属性：（写到table里面）；
< thead>标题< /thead > < tbody>主体< /tboday> 可设定标头和尾；

11、合并单元格技巧

1、跨行合并：roswpan=“行数”;目标单元格为最上方；
2、跨列合并: colspan=“列数”;目标单元格为最左方；
3、记得删除多余单元格；

12、列表标签(有序和无序)就是ol或（ul）标签+li标签

效果如下：

• 123
• 456
• 789

1. 123
2. 456
3. 789

基本用法：用法基本标签的格式；

13、自定义列表(dl dt dd)

效果如下：

关于我们

联系电话

传真

名词解释

基本用法：用法基本标签的格式； #### 14、表单 组成：表单域、表单控件、提示信息3部分组成； 表单域标签：< form > < /form > 表单域作用：实现用户局数据的收集 基本属性

表单控件：允许用户在表单中输入或操作选择的一些控件
类型：
1、input：输入表单元素
2、select：下拉表单元素
3、textarea:文本域元素
4、

注意：
name和vale是给后台人员使用的
name：单选按钮和复选框要有相同的值；
lable标签：能绑定图片和其他东西选择我们的按钮

select ：下拉菜单的option标签用于选项。sleected=“slected”,当前默认选项；
文本域标签：< textarea >< /textarea >