HTML百度百科:
HTML称为超文本标记语言,是一种标记语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字,图形、动画、声音、表格、链接等。
而我总结HTML用于搭建基础网页,展示网页内容
- html后缀名为htm或html
- 标签分为:
- 围堵标签:有开始和结束的标签:如
- 自闭和标签:即开始标签和结束标签在一起(
)
*标签可以嵌套:即一个标签在另一个标签里面(,即html标签嵌套了head标签) - 在开始标签可以定义属性,属性有键值对组成,值需要用引号引起来(单双引号都可)(打)
- HTML标签不区分大小写
- html的注释方式是
HTML的基础标签
- 文件标签
- html文档的根标签
* <br/>换行标签
*h1-h6都是标题标签:h1到h6标签字体都加粗,但是字体字号逐渐变小,该标签自带换行<h1>"标题"</h1>
* <p></p>是段落标签
* <p>
* fhfsidi<!--在p标签中的内容会被当成一段>
* </p>
* <hr/>展示一条水平线在该标签里可添加一些属性,来自定义水平线(width(宽度),size(厚度),color,align(对其方式有(向左对齐)left,right,center))
* <b></b>字体加粗
* <i><i/>字体斜体
* <font></font>字体标签(通过其属性自定义字体如color,字号(size),字体(face如楷体))
* <center></center>居中标签
* color可通过调色合成即color=“#00ffff”三种植分别是红绿蓝的占比从00-ff(十六进制)
* width(可直接写200(即200个像素,一个像素就是一个小点或50%即与屏幕占比50%))
* 实现空格的字符:( )- 图片标签:
* <img/>可以在该标签中添加图片路径及其属性
* (<img src="1.jpg(图片的路径,建议把图片放在与HTML文件相同的目录下) width="500" height="300" alt(当图片没加载出来或者路径错了就会显示的文本信息)="家" align="right"/>)
* 一般图片路径是相对路径:./代表是当前目录,../代表上一级目录("../s/1.jpg"s目录为与图片所在目录同级,所以要退回上一级目录),若不写任何字符,如1.jpg代表默认是当前目录
* 列表标签:
* <ol><ol/>:表示有序列表,其中包含着许多由列表项标签<li><li/>包裹着的列表项
* <ol type="a" start="3">type代表为列表标识符是(type默认是从1,start默认从1开始)根据字母排序从第三个c开始
* (结果是c.吃饭
* d.睡觉
* e.打豆豆
* )
* <li>吃饭<li/>
* <li> 睡觉<li/>
* <li> 打豆豆<li/>
* <ol/>
* <ul><ul/> 表示无序列表(它的常用type是disc(默认,实心圆点),square(方块),circle(圆圈))
* **超链接标签**
* <a href="https://www.baidu.com" target="_self">点击</a>
* <a href="sds.html" target="_blank">点击</a>这是本地资源的超链接方式
* 在该标签中写属性href表示url(定位符)即路径网址,target="_self(默认)表示在本页面跳转到该网址target="_blank表示在新建页面跳转到该网址"
* <span>ffs</span>只起到包裹作用,不换行,只在一行,即写两个该标签,两个该标签的内容在同一行展示
* <div>ffs</div>只起到包裹作用,换行,即写两个该标签,两个该标签的内容在不同行展示(z这两个标签与css常用)- 语义化标签
* :<header></header>//包裹开头(在看代码是表示这是开头)
* <footer></footer>//包裹结尾(在看代码是表示这是结尾)- 表格标签:
* table:(属性:border:表格边框的像素点(border=“8 ”),)定义表格
* tr:定义行(属性:bgcolor(背景色),align:文本位置,width,height)
* td:定义单元格(
* 属性:rowspan:合并行(合并的行算合并的行的第一行的行,即第一行与第二行合并那合并的行是第一行的单元格,若由3 列那第一行由3个单元格,而第二行只有2个单元格),colspan:合并列)
* th:定义表头单元格(第一行的单元格)用该标签取包裹字体会变成粗体
* caption:定义表格标题
* 下面三者只起注释作用(语义化标签)
* thead:表示表格的头部分,表示最先展示的一行,无论写在table里的那个位置
* tbody:表示表格的体部分
* tfoot:表示表格的脚部分,表示最后展示的一行,无论写在table里的那个位置
* 若用table完成布局,可以在单元格中嵌套table- 表单标签:
*form:(属性:action:提交数据的url(一般提交到服务器,所以写服务器的路径,网址))用于定义表单,可以定义范围,范围代表用户的数据信息范围,被表单标签包裹的标签采集的数据会被提交到后台
*属性:method:指定提交方式(一共由7种,常用2种,get,post)
- get与post的区别(面试重点)
*get:请求信息会在地址栏中显示 - 请求参数(即url)的长度大小有限制
- 不太安全
- post:请求信息不会再地址栏中显示,会封装再请求体中(HTTP协议)
- 请求参数(即url)的长度大小没有限制
- 比较安全
- (属性:name,type,placeholder, value)
- 默认是生成一个输入框,表单项中的数据要被提交,必须指定其name属性值
*input中type的取值:
- text,(默认)即文本输入框
- password(输入数据会被隐藏)
- radio(单选框,但是只有两个input标签的name是一样的才能实现单选,要提交给服务器被选中的值可以用value进行赋值)
- <input type="radio"name=“sex” value=“nan”/><input type="radio"name=“sex” value=“nv”/>
- checkbox(多选框,同样name也应一样,要提交给服务器被选中的值可以用value进行赋值)
- 要实现单选框或多选框的默认选中某一项,可在那一项的input标签加上checked=“check”(默认值)当然也可不赋值,直接写checked
- file:可以选择图片或文件
- hidden:隐藏域用于提交一些信息
- submit:提交按钮,可以提交表单
- button:只是一个按钮
- image:图片按钮,图片提交按钮,,src指定图片的路径
- color:生成取色器
- date:只显示年月日的选择框
- datetime-local:显示年月日时分秒
- Email:在该输入框中要输入带有@的数据(即邮箱)
- number:定义输入数字的字段
- input的其他属性
* placeholder(提示信息,如点击输入框后该提示信息会消失)placeholder=“请输入用户名”
* name(框内要输的数据的名称)
* value(指定type内的值)
* <label>用户名</label>标签
* 该标签属性有for,for的值与被包裹的文字对应的input标签的属性id的值是一样的,这样做当点击用户名区域,会让input输入框获取焦点
* 例子<label for="user">用户名</label><input name="username"type="text" placeholder="请输入用户名" id="user"/>***下拉列表*
*<select></select>:定义下拉列表(必须给select添加name的属性值才能提交你选中的值)
***下拉列表项**
<option></option>:定义下拉列表项(在该列表项中加selected,就表示被默认选中,可给列表项用value赋值,这样可传选中值给服务器)
















