超文本:是用超链接的方法,将各种不同空间的文字信息组织在一起的网状文本。
标记语言:由标签构成的语言<>。标记语言不是编程语言
快速入门
语法
1、后缀名:.html或.htm
2、标签分类
围堵标签:有开始标签和结束标签 <html></html>
自闭和标签:开始和结束标签在一起 <br/>
3、标签可以嵌套
4、在开始标签中可以定义属性。属性由键值对构成,需要用引号引起来
5、html标签不区分大小写,但建议使用小写
标签
分类:文件标签、文本标签、图片标签、列表标签、连接标签、语义化标签、表格变迁、表单标签
文件标签:构成html最基本的标签
html:html文档的跟标签
head:头标签,用于指定html文档的一些属性。用于引入外部资源
title:标题标签
body:体标签
<!DOCTYPE html>:html5中定义该文档是html文档
文本标签:与文本相关
注释<!--注释内容-->
<h1> to <h6>:标题标签 从h1-h6字体大小逐渐递减
<p>:段落标签
<br>:换行标签
<hr>:显示一条水平线
在<hr>中需要一些参数表示水平线的属性
color:颜色;width:宽度;size:高度
align:对齐方式(center:居中;left:左对齐;right:右对齐)
<b>:字体加粗
<i>:字体斜体
<font>:字体标签
<font>标签中也有一些属性
color:①英文单词②rgb(值1,值2,值3):值的范围(0-255)③#值1,值2,值3:00-FF
width:①数值:width='20',单位是像素px②数值%:占比相对于父元素的比值
图片标签:导入图片到src下
语法:<img src="相对路径“> 如果图片信息不存在,显示alt
属性:align:对齐方式;width:宽度;height:高度
列表标签:
有序列表(ol),无序列表(ul)。li是修改列表标号
链接列表
语法:<a href>""</a>
属性:href执行访问资源的URL(统一资源定位符)
target:指定打开资源的方式。
*_self:当前页面(默认);*_blank:空白页面
语义化标签:提高可读性
<header> <footer>
div和span
div:文本信息在一行展示,称为行内标签(内联标签)
span:每一个div占满一整行,称为块级标签
表格标签:
<table>:定义表格
width:宽度;border:边框;bgcolor:背景色;align:打开方式;cellspacing:定义单元格之间的距离;cellpadding:定义内容和单元格之间的距离
<tr>:定义行。align,color
<td>:定义单元格 。colspan:合并列;rowspan:合并行
<th>:定义单元格表头
<caption>:表格标题
<thead>:表示表格的头部分
<tbody>:表示表格的体部分
<tfoot>:表示表格的脚部分
表单标签
表单:用于采集用户输入的数据。用于与服务器进行交互
form标签:用于定义表单。可以定义一个范围,代表采集用户的范围
属性
action:指定提交数据的URL
method:指定提交方式
最主要的两种:get和post
get:
1、请求参数会在地址栏中显示。封装在请求行中(http)
2、请求参数大小有限制
3、不太安全
post:
1、请求参数不会再地址栏中显示。封装在请求体重
2、请求参数没有大小限制
3、较为安全
表单项中的数据想要被提交,必须指定name属性
表单项标签:
input:可以通过type属性值,改变元素展示的格式
type属性
text:文本输入框,默认
placeholder:指定输入框的提示信息,当输入框的内容发生变化时,会自动清空提示信息
value:指定框内的值
password:密码输入框
radio:单选框
1、想让多个单选框实现单选效果,多个单选框name属性值必须一致
2、一般会给每一个单选框提供value属性,指定被选中后提交的值
3、checked属性指定默认
checkbox:复选框
1、values:指定提交的值
2、checked:默认值
label:指定输入项的文字描述信息
label的for属性和input的id属性对应。一旦对应,点击label区域可以让input输入框获取焦点
file:文件选择框可以选择上传文件、图片
hidden:隐藏域,用于提交一些信息
按钮:submit(提交按钮,可以提交表单)button(普通按钮)image(图片提交按钮)src可以指定图片路径
select:下拉按钮
子元素:option,用于指定列表项
textarea:文本框
cols:指定列数;rows:默认行数