1.1 什么是HTML?

HTML是用来描述网页的一种语言

HTML是一个超文本标记语言

HTML不是一种编程语言，而是一种标记语言

HTML使用标记标签来描述网页

1.2 什么是HTML标签？

HTML标记标签通常被称为HTML标签(HTML tag)

HTML标签通常是成对出现的，比如

<b>和</b>  第一个是开始标签，第二个是结束标签

HTML标签也存在是单独出现的，比如

<br>

1.3 HTML的结构

html:文档的跟标签

head:头，标签处

​ title:适配搜索引擎 meta charset=utf-8

​ link:链接css的,引入css样式

​ style:定义css样式

​ script:定义js，也可以引入js

body:身体

1.4 HTML基本标签

标题标签：

<h1>这是一个标题h1</h1>
<h2>这是一个标题h2</h2>
<h3>这是一个标题h3</h3>

段落标签:

<p>这是一个段落</p>
<p>这是另一个段落</p>

换行标签:一个br相当于一个回车

<br>

水平线标签:

<hr>水平分割线

链接标签:

href：要去的地方
http地址（完整域名）:带有http或https的完整网址
默认的方式去到当前项目下某一个页面（地址）
../：返回上一级目录
./：当前目录（不需要写）
target：目标。怎么打开目标地址
_blank：在新窗口打开
_self：在当前窗口打开（默认）
_parent、_top：在父容器（顶级父容器）打开
title：标题，当鼠标悬停在标签上出现的提示文字

<a href="https://www.baidu.com/" target="_blank">百度一下</a>

图片标签：
src：图片的路径
height、width：宽和高（尽量指定一个属性，等比例缩放）
title：
alt：图片无法正常加载的提示文字
align：对齐方式

<img src="../百度一下.png" alt="图片加载不出来" height="200">

区块/空白：
div：块。立方体，可以有宽高
span：行。没有宽和高。尺寸是根据内容确定

1.5 HTML文本格式化

粗体:b标签 strong标签

斜体:i标签

字体倾斜：em标签

上标:sup标签

下标:sub标签

1.6 HTML列表

无序列表：

<ul>
    <li></li>
</ul>

有序列表：

<ol>
	<li></li>
</ol>

自定义列表：

<dl>
	<dt></dt>
	<dd><dd>
</dl>

1.7 HTML表格

表格：一组标签
table表格 th表头 tr行 td列

border属性规定表格单元周围是否显示边框 值“1”值显示边框

学号 姓名 性别 专业 家庭住址 注释
01 张三 男 软件工程 吉林省 无
02 李四 男 软件工程 吉林省
无

1.8 HTML框架

1.ifream用于在网页中内嵌另一个网页

2.ifream默认有宽高，存在边界

元素介绍

src:指定内联网页的地址

frameboder:可以设置frameboder为0清除边界

1.9 转义字符

常见的转义字符

&lt;    小于号<
&gt;	大于号>
&nbsp;	空格

2.1 表单标签

表单是一个包含表单元素的区域，可以使用

标签来创建表单

<form action="-----" method="post">
    
</form>

1.action内填写数据提交的地址

2.method：
get：提交的数据都会显示在地址栏，不安全，地址栏长度是有限制的。
post：提交的数据是不显示在地址栏，封装一个请求体，长度也没有限制了。

表单元素

1.文本域

文本域通过 input type="text" 标签来设定，当用户要在表单中键入字母、数字等内容时，就会用到文本域

<form>
    文本域：<input type="text" placeholder="请输入你的用户名">
    文本域：<input type="text" value="请输入你的用户名">
</form>

placeholder：类似于水印 无法删除

value：设置文本框内的文本 可删除

所有的文本框的内容都是它的value属性

2.密码字段

密码字段通过标签 input type="password" 来定义

<form>
    密码：<input type="password">
</form>

注意：密码字段字符不会明文显示，而是以星号 ***** 或圆点 . 替代

3.单选按钮

input type="radio" 标签定义了表单的单选框选项

<from>
    <input type="radio" >男
	<input type="radio">女
</from>

4.复选框

input type="checkbox" 定义了复选框

复选框可以选取一个或多个选项

<from>
    <input type="checkbox" >反方向的钟
	<input type="checkbox">我是如此相信
</from>

5.提交按钮

input type="submit" 定义了提交按钮。

当用户单击确认按钮时，表单的内容会被传送到服务器

<form name="input" action="-----" method="get">
	Username: <input type="text">
	<input type="submit">
</form>

注意：1.提交按钮内默认有提交两字

​ 2.提交和重置按钮，只能控制和他们在同一个form标签内的元素

​ 3.提交、重置等按钮要和form表单配合使用

2.2 行级元素：不能自己换行。

（1）span、img、a、label、code、input、abbr、em、b、big、cite、i、q、textarea、select、small、sub、sup，strong、u等

  • 行内元素不能独占一行，与其他行内元素排成一行，其宽度随元素的内容变化而变化
  • 行内元素不能设置宽高
  • 行内元素只能包括文字或行内元素、行内块元素，不能包括块级元素

（2）有一些特别的行内元素可设置宽高
img、 input、 textarea、select、object

2.3 块级元素

div、p、h1-h6、form、ul、ol、dl、dt、dd、li、table、tr、td、th、hr、blockquote、address、table、menu、pre等

  • 块级元素独占一行，可以自动换行
  • 块级元素允许设置宽高
  • 块级元素可以包行内元素、块级元素

知识点掌握情况:了解

心得体会:第一次接触，感觉比较新奇的，挺有兴趣。接下来好好努力