一.什么是HTML
1.HTML是超文本标记语言,使用标签来描述网页的一门编程语言
二.HTML的作用
1.HTML文件被浏览器加载读取,并以网页的形式展示,简单来说它就是用来写网页,展示信息的
三.HTML的书写
1.所有的HTML文件都是以.html或者.htm结尾(建议用.html)
2.html的头部是<head> </head>
3.html的体部分是<body></body>
4.HTMl标签忽略大小写(建议小写) 5.HTML代码中的所有键盘键入而用非标签定义的
连续的空行(换行)也被显示为一个空格。
6.空标签只包含属性,没有闭合标签
7.HTML标签大部分是成对的出现(开头到结尾)
四.基本概念
元素
1.定义:是指从开始的标签到结束的标签中间所有的代码
2.特点:
a.大多数HTML元素可以嵌套 b.默认情况下,HTML会自动在块级元素前后添加空格(例如段落,标题元素的前后)
3.分类:
a.块元素:在浏览器显示时,通常会以新行来开始
例如:<h1></h1> <p></p>
b.内联元素:内联元素在显示时,通常不会以新行开始
例如:<b></b>,<tb></tb>
属性
1.定义:属性提供了有关HTML元素的更多信息
2.分类:
全局属性
时间属性
3.特点:
a.属性总是以 名称/值 的形式出现,比如: name="value"
b.属性总是在HTML元素的开始标签中规定
c.属性值应该始终被包括在引号内,双引号(常用) 引号均可。如果属性值本身就含有双引号,那么必须使用单引号。
五.常用标签
基本标签
1.<html>与</html>之间的语句用来描述网页
2.<head>标签用于定义文档的头部,他是所有头元素的容器</head>
(文档的头部描述了文档的各种属性和信息,包括文档的标题,在web中的位置以及和其他文档的关系)
3.<title>定义文档的标题</title>
4.<base>为页面上的所有链接规定默认地址或默认目标。
( target属性规定了在何处打开页面中所有的链接。)
5.<meta> 空元素,可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。服务器端接收到信息之后,根据<meta>中的信息进行相应处理。
6.<link>
( rel属性规定当前文档与被链接文档之间的关系。
type属性规定了文档类型
media属性指定目标文档在哪种设备上起作用)
7.<body>与</body>之间的文本是可见的页面内容
文档格式标签
1.<br\>定义换行
2.<hr />标签在 HTML 页面中创建水平线
3.<div>给在中甲你的类容在页面单独分块</div>
4.<span>组合行内元素,以便通过样式来格式化它们</span>
5.<marquee>让在标签内的内容动起来</marquee>
6.<pre>保留HTML中代码原有书写样子</pre>
文本格式标签
1.<h1>与</h1>值加你的文本被显示成标签<1-6表示字体大小>
2.<p>与</p>值加你的内容被显示成段落
3.<font ></font>规定文本的字体,字体大小,字体颜色
属性: face:规定文本的字体
size:规定文本的大小
color:规定文本的颜色
表格标签
1.<table>创建一个表格</table>
常用属性:
边框:border
宽度:width
高度:height
背景颜色:bgcolor
边框与边框的:cellspacing
边框与内容的:cellpadding
居中显示:align
2.<caption>标题</caption>)( <caption>标签必须紧随<table>标签之后,一个表格只能有一个标题)
3.<th>表头</th>
4.<tr>行</tr>
5.<td>列</td>
*常用属性:*
align:用于设定单元格内容的对齐方式。
bgcolor:用于设定单元格背景颜色。
height:用于设定单元格的高度。
width:用于设定单元格的宽度。
colspan:用于设定列合并
rowspan:用于设定行合并。
列表标签
1.<ol>有序列表</ol>
2.<ul>无序列表</ul>
3.<li>列表项</li>
4.<dl>自定义列表</dl>
5.<dt>自定义项目</dt>
6.<dd>自定义的描述</dd>
表单标签
(如果想将页面输入提交到服务器,就必须有value和name属性)
<form>表单:用于创建用户输入的HTML表单,用于和服务器的交互
<form>常用属性:
name:用于定义表单的名称
action:用于规定提交表单时向何处发送表单数据。
method:用于规定提交的方式。一般取值 POST或GET
<input> input元素 它的type属性包括:
1.button 定义可点击按钮
2.chekbox 定义复选框
3.file 定义输入字段和'浏览按钮',供文件上传
4.hidden 定义隐藏的输入字段
5.image 定义图像形式的提交按钮
6.password 定义密码字段(该字段中的字符被掩盖)
7.radio 定义单选按钮
8.reset 定义重置按钮(重置按钮会清空表单中的所有数据)
9.submit 定义提交按钮.提交按钮会将表单数据发到服务器
10.text 定义单行的输入字段
11.<select>下拉列表</select>
<option>元素定义待选择的选项</option>
12.<textarea>元素定义多行输入字段(文本域)</textarea>
13.<button>原属定义可点击的按钮</button>
</form>
图像标签
1.<img>是空标签
属性: src 图像的url地址
边框:border
宽度:width
高度:height
居中显示:align
2.<map> 图像地图##标题##</map>
3.<area>定义图像中的可点击区域
连接标签
<a>创建连接,属性:
href 创建指向另一个文档的连接
name 创建文档内书签
target 定义被连接的文档显示的位置
</a>
代码标签
<script>标签用于定义客户端脚本</script>
常用属性
align 对齐方式
bgcolor 背景颜色
border 表格边框
title 规定关于元素的额外信息,这些信息通常会在鼠标移到元素上时显示一段工具提示文本
style 规定元素的行内样式,将覆盖任何全局的样式设定,如
class 规定元素的类名
id 规定元素的唯一 id
action 定义在提交表单时执行的动作,如果省略 action 属性,则 action 会被设置为当前页面
指定了某个服务器脚本来处理被提交表单
method 属性规定在提交表单时所用的 HTTP 方法(GET 或 POST)
name 如果要正确地被提交,每个输入字段必须设置一个 name 属性
六.POST与GET方式区别:
1.get方式只能少量数据,而post可以携带大数据。
2.get方式提交时,数据会在地址栏上显示,安全性差。Post方式提交不会在地址栏上显示数据,更加安全。