前端之 HTML🎃
HTML这知识点很多很杂,所以整理很乱.所以将就看.🙈
首先呢,我们需要了解一下到底HTML是什么?
html : Hypertext Markup Language. 超文本标记语言.是通过标签语言来标记要显示的网页中的各个部分.它更是一套规则,一套可以让浏览器认识的规则.
浏览器不同,兼容性也可能会不同,同一个标签可能就会有不同的解释.
HTML不是一种编程语言,而是一种标记语言.使用标记标签来描述网页.
🎃html结构和标签格式
<!DOCTYPE html> 告诉浏览器使用什么样的html或者xhtml来解析html文档
<html></html>是文档的开始标记和结束标记。此元素告诉浏览器其自身是一个 HTML 文档,在它们之间是文档的头部<head>和主体<body>。
<head></head>元素出现在文档的开头部分。<head>与</head>之间的内容不会在浏览器的文档窗口显示,但是其间的元素有特殊重要的意义。
<title></title>定义网页标题,在浏览器标题栏显示。
<body></body>之间的文本是可见的网页主体内容
🎃标签格式 : <>
注意: 1. 标签分为闭合标签(双边标记,如<div></div>)和自闭合标签.但是大部分都是闭合标签
闭合标签: 有头有尾
例<a></a>,<form></form>...
自闭合标签 : 有头无尾
例<input>,<img>,</br>,</hr>...
2. 标签不区分大小写,推荐小写.
3. 标签可以带若干属性,也可以一个属性都不带.
4. 标签可嵌套,但是不能交叉嵌套.
🤖常用标签分类:
块级 : 独占一行 (h1 - h6 , p , tr)
内联 : img , a , b , strike(为文字加上一条中线) , em(斜体文字)
块级标签和内联标签的区别 :
块级标签: 是另起一行开始渲染的标签.
行内标签即内联标签则不需另起一行.如果单独在网页中插入这两个元素,不会对页面产生任何影响.
这两个元素是专门为定义CSS样式而生.
列表标签 :
<ul> : 无序列表
<ol> : 有序列表
<li> : 列表中的每一项
<dl> : 自定义列表
<dt> : 列表标题
<dd> : 列表项
列表标签 : <table>
表格最重要是作用是显示表格类数据.
基本结构 :
<table>
<tr>
<th></th>
</tr>
<tr>
<td></td>
</tr>
</table>
tr : table row 行 $$$块级标签
th : table head cell
td : table data cell最小元素.表示列 $$$内联标签
表单标签 : <form>
功能 : 表单用于向服务器传输数据,来实现用户和WEB服务器的交互.
表单能够包含input系列标签,比如文本字段、复选框、单选框、提交按钮等等。
表单还可以包含textarea、select、fieldset和 label标签。
表单属性
action: 表单提交到哪.一般指向服务器端一个程序,程序接收到表单提交过来的数据(即表单元素值)作相应处理,比如https://www.sogou.com/web
method: 表单的提交方式 post/get默认取值就是get
表单元素
基本概念:
HTML表单是HTML元素中较为复杂的部分,表单往往和脚本、动态页面、数据处理等功能相结合,因此它是制作动态网站很重要的内容。
表单一般用来收集用户的输入信息
表单工作原理:
访问者在浏览有表单的网页时,可填写必需的信息,然后按某个按钮提交。这些信息通过Internet传送到服务器上。
服务器上专门的程序对这些数据进行处理,如果有错误会返回错误信息,并要求纠正错误。当数据完整无误后,服务器反馈一个输入完成的信息
<form action='http://sssss' methed='GET' enctype='multi'>
<div>asdfasdf</div>
<input type='text' name='q' />
<input type='text' name='b' />
# 上传文件
<input type='file' name='f' />
<input type='submit' />
</form>
GET: http://sssss?q=用户输入的值
http://sssss?q=用户输入的值&b=用户输入的内容
POST:
请求头
请求内容
🌈