2021-02-25

学习目标：

小白起飞第32天

学习内容：

表格概述
表格就可以看做数据库表,多少行多少列,列名 等
主要用于展示数据

标签
1.table用于定义一个表格。
2.tr 用于定义表格中的一行，必须嵌套在 table标签中，在 table中包含几对 tr，就有几行表格。
3.th /td：用于定义表格中的单元格，必须嵌套在标签中，一对 中包含几对，就表示该行中有多少列（或多少个单元格）。

注意 :

1. 中只能嵌套
2. 标签，他就像一个容器，可以容纳所有的元素

Table属性

结构

标题

使用caption来定义表的标题

合并单元格
跨行合并：rowspan
跨列合并：colspan
合并单元格的步骤：
1、先判断跨行合并还是跨列合并
2、跨行合并用rowspan属性，跨列合并用个colspan属性
3、将rowspan 或者colspan写在第一个要合并的单元格上
4、将合并的行数和列数写在指定的属性值上
5、将多余的单元格注释掉

表单 概述
主要用于对用户进行数据采集,让用户输入数据
比如 登陆,注册,添加,更改等 所有需要用户输入的地方

表单，在网页中的作用不可小视，主要负责数据采集的功能，比如你可以采集访问者的名字和e－mail地址、调查表、留言簿等等。
一个表单有三个基本组成部分： 表单标签：这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。 表单域：包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。 表单按钮：包括提交按钮、复位按钮和一般按钮；用于将数据传送到服务器上的CGI脚本或者取消输入，还可以用表单按钮来控制其他定义了处理脚本的处理工作。
应用场景：主要是应用在数据的提交，比如点击按钮发送数据到服务端。
表单标签
在HTML中，form标签被用于定义表单域，即创建一个表单，以实现用户信息的收集和传递，form中的所有内容都会被提交给服务器。创建表单的基本语法格式

常用属性

1. action在表单收集到信息后，需要将信息传递给服务器进行处理，action属性用于指定接收并处理表单数据的服务器程序的url地址。
2. method用于设置表单数据的提交方式，其取值为get或post。
   Get 明文传输,数据量相对较少,不是很安全
   Post 非明文传递,有请求体,数据量相对较大,较安全
   获取数据用get,发送数据用post
3. name用于指定表单的名称，以区分同一个页面中的多个表单。

input控件
input 输入的意思。在上面的语法中，input标签为单标签，type属性为其最基本的属性，其取值有多种，用于指定不同的控件类型。除了type属性之外，input标签还可以定义很多其他的属性，其常用属性如下表所示。
属性和取值

radio如果是一组，必须给他们命名相同的名字name，这样就可以多个选其中的一个啦。
Input的size跟字体大小有关系，不设置的情况下，浏览器默认情况下，input默认的输入框的宽度就是169px
使用

        </tr>
        <tr align="center">
            <td colspan="2">
                <!-- 可以提交 -->
                <button>button会触发action</button>
                <!-- 普通按钮 -->
                <button type="button">button[type="button"]不会触发action</button>
                <!-- 普通按钮 -->
                <input type="button" value="input[type='button']不会触发action">
                <!-- 提交按钮 -->
                <input type="submit" value="input[type='submit']会触发action">
                <!-- 重置按钮 -->
                <input type="reset" value="重置">
                <!-- 使用图片代替提交按钮 -->
                <input type="image" src="./images/faq01.jpg">
            </td>
        </tr>
    </form>
</table>

学员信息录入

姓名
密码
性别	男 女 保密
学校	河北科技大学 河北师范大学 河北地质大学
选修课程	java Oracle Android
自我评价
上传头像

扩展-禁用输入框
更改操作,用户名不可以更改,这种情况,可以使用对该输入框禁用
Readonly : 可以获得焦点,但是不可以修改,另外数据可以传递
Disable : 不可以获得焦点,不可以修改,数据不可以传递

CSS 概述
美化页面、布局排版
从HTML被发明开始，样式就以各种形式存在。不同的浏览器结合它们各自的样式语言为用户提供页面效果的控制。最初的HTML只包含很少的显示属性。随着HTML的成长，为了满足页面设计者的要求，HTML添加了很多显示功能。但是随着这些功能的增加，HTML变的越来越杂乱，而且HTML页面也越来越臃肿。于是CSS便诞生了。
放置方式
如何将html和css关联起来
内部样式
又称为内嵌式,在head标签中 使用style标签来编写css代码

总结：

1. 语法中，style标签一般位于head标签中title标签之后，也可以把他放在HTML文档的任何地方。
2. type=“text/CSS” 在html5中可以省略， 写上也比较符合规范， 所以这个地方可以写也可以省略。

行内样式
行内样式表,是通过标签的style属性来进行编写css代码

外部样式
需要单独创建一个css文件,把所有的css代码写到里面
然后在html中使用link标签引入即可

href：定义所链接外部样式表文件的URL，可以是相对路径，也可以是绝对路径。
type：定义所链接文档的类型，在这里需要指定为“text/CSS”，表示链接的外部文件为CSS样式表。
rel：定义当前文档与被链接文档之间的关系，在这里需要指定为“stylesheet”，表示被链接的文档是一个样式表文件。

语法结构
使用HTML时，需要遵从一定的规范。CSS亦如此，要想熟练地使用CSS对网页进行修饰，首先需要了解CSS样式规则，具体格式如下：
在上面的样式规则中:
1.选择器用于指定CSS样式的HTML对象，花括号内是对该对象设置的具体样式。
2.属性和属性值以“键值对”的形式出现。
3.属性是对指定的对象设置的样式属性，例如字体大小、文本颜色等。
4.属性和属性值之间用英文“:”连接。
5.多个“键值对”之间用英文“;”进行区分。
可以用段落和表格的对齐的演示。

字体属性
Font-size 字体大小,常用单位px和em

Font-weight 字体粗细
字体加粗除了用b和strong标签之外，可以使用CSS 来实现，但CSS是没有语义的。
font-weight属性用于定义字体的粗细，其可用属性值：
normal、bold、bolder、lighter、100~900（100的整数倍）。
小技巧：
数字400等价于normal，而700等价于bold。但是我们更喜欢用数字来表示
Font-style 字体风格
字体倾斜除了用 i 和 em 标签之外，可以使用CSS 来实现，但是CSS 是没有语义的。
font-style属性用于定义字体风格，如设置斜体、倾斜或正常字体，其可用属性值如下：
normal：默认值，浏览器会显示标准的字体样式。
italic：浏览器会显示斜体的字体样式。
oblique：浏览器会显示倾斜的字体样式。
小技巧：
平时我们很少给文字加斜体，反而喜欢给斜体标签（em，i）改为普通模式。

Font-family 字体
font-family属性用于设置字体。网页中常用的字体有宋体、微软雅黑、黑体等，例如将网页中所有段落文本的字体设置为微软雅黑，可以使用如下CSS样式代码：
p{ font-family:“微软雅黑”;}
可以同时指定多个字体，中间以逗号隔开，表示如果浏览器不支持第一个字体，则会尝试下一个，直到找到合适的字体。
常用技巧

1. 现在网页中普遍使用14px+。
2. 尽量使用偶数的数字字号。ie6等老式浏览器支持奇数会有bug。
3. 各种字体之间必须使用英文状态下的逗号隔开。
4. 中文字体需要加英文状态下的引号，英文字体一般不需要加引号。当需要设置英文字体时，英文字体名必须位于中文字体名之前。
5. 如果字体名中包含空格、#、$等符号，则该字体必须加英文状态下的单引号或双引号，例如font-family: “Times New Roman”;。
6. 尽量使用系统默认字体，保证在任何用户的浏览器中都能正确显示。
   Unicode字体
   在 CSS 中设置字体名称，直接写中文是可以的。但是在文件编码（GB2312、UTF-8 等）不匹配时会产生乱码的错误。xp 系统不支持 类似微软雅黑的中文。
   方案一：你可以使用英文来替代。比如 font-family:“Microsoft Yahei”。
   方案二：在CSS 直接使用Unicode编码来写字体名称可以避免这些错误。使用Unicode 写中文字体名称，浏览器是可以正确的解析的。font-family: “\5FAE\8F6F\96C5\9ED1”，表示设置字体为“微软雅黑”。

font:综合设置字体样式 (重点)
font属性用于对字体样式进行综合设置，其基本语法格式如下：
选择器{font: font-style font-weight font-size/line-height font-family;}
注意：

1. 使用font属性时，必须按上面语法格式中顺序书写，不能更换顺序，各属性以空格隔开。
2. 其中不需要设置的属性可以省略（取默认值），但必须保留font-size和font-family属性，否则font属性将不起作用。

学习时间：

提示：这里可以添加计划学习的时间
例如：
1、 周一至周五晚上 7 点—晚上9点
2、 周六上午 9 点-上午 11 点
3、 周日下午 3 点-下午 6 点

---

学习产出：

提示：这里统计学习计划的总量
例如：
1、 技术笔记 2 遍
2、CSDN 技术博客 3 篇
3、 学习的 vlog 视频 1 个