HTML 基本入门

一、html简介

html全称，hypertext markup lanuage 超文本标记语言。作用是用于网站制作，是学习网页制作的第一门语言。

软件结构分类：

C/S结构：  Client-Server 客户端和服务器

典型应用：聊天室（socket），飞秋，红蜘蛛，QQ

特点:

1）必须安装特定客户端

2）服务器端升级，客户端必须升级

B/S结构： Broswer - Server 浏览器和服务器

典型应用：淘宝网站、游戏官网

特点：

1）不需要特定的客户端（只需一个浏览器软件即可）

2）服务器端升级，不需要升级客户端

                javaweb开发大部分的软件结构都是基于B/S结构的！！！

                服务器存放了网站（软件）,网站是网页组成，网页是由html标签组成的！！！！

                html: 文本+特定标签: 超级文本               html重点：学习标签

二、html语法

1.1 html文件结构

HTML文件后缀名 .html 或 .html

       

html文件头: 告诉浏览器如何解析这个html文件

html文件体：  : 这部分内容可以让用户直接看到

1.2 文本标签

标题：~    段落：

缩进段落：  换行：

线条:

---

上下标 : 上标  下标

列表：

无序列表: ul li

有序列表： ol  li

项目列表： dl  dt dd

字体：

1.3 超链接标签

作用：

1）导向文件（html页面，图片，音乐...）

2）链接到锚点

                常用属性

href:  导向的资源路径或者锚点名称

注意：href资源的路径必须带上协议。

file:/// 本地文件协议

http://   http协议，找互联网上的资源。

http执行过程

thunder:// 迅雷客户端的协议

target: 打开方式。 _self: 当前窗口  _blank: 新窗口

1.4 图像标签

常用属性：

src: 图像源的路径

width+height: 宽高

alt: 替代文本

title: 提示文本

       

1.5 表格标签

 -- 表格

 -- 表格头部

 -- 表格的主体

 -- 表格的脚部

 -- 一行

常用属性：

border: 边框

width+height: 宽高

align: 对齐方式。 left center right

rowspan:  行合并。把处于多行的单元格合并一起

colspan:  列合并。把处于多列的单元格合并一起

1.6 表单标签

: 表单标签

属性：

action: 把当前表单的数据提交到哪里

  method: 提交方式

  get方式:

1)把用户提交的数据暴露在地址栏

2)不适合提交敏感数据

3)不适合提交比较多内容(不大于1kb)

  post方式

1）不会暴露用户提交的数据

2）可以提交敏感数据

3）适合任何大小的内容( 文件上传必须使用post  )

: 单行输入域。只能输入一行内容

属性：

name: 该属性一定带上，因为后台程序接收数据必须使用name属性 

size: 输入字符长度

readonly: 只读不能写

value: 默认值

: 密码输入域。输入的数据不会回显明文内容

name: 该属性一定带上，因为后台程序接收数据必须使用name属性 

size: 输入字符长度

readonly: 只读不能写

value: 默认值

: 单选按钮。

name: 该属性一定带上，因为后台程序接收数据必须使用name属性。

如果是作为同一组的内容，name属性值必须相同

value: 默认值，也是传递到后台程序的数据内容。必须带上！！！

checked：默认的选择状态。把checked加到哪里，哪个就选上！！

name: 该属性一定带上，因为后台程序接收数据必须使用name属性。

如果是作为同一组的内容，name属性值必须相同

value: 默认值，也是传递到后台程序的数据内容。必须带上！！！

checked：默认的选择状态。把checked加到哪里，哪个就选上！！(可以多个都checked上)

：文件选择框

                 ： 下拉选择框

name: 该属性一定带上，因为后台程序接收数据必须使用name属性

size: 可以让select显示多个选项

multiple: 可以让用户选择多个选项

--一行中的一个单元格

-- 表头

 : 表示每个选项

value: 默认值，也是传递到后台程序的数据内容。必须带上！！！

selected：默认的选择状态。把selected：加到哪里，哪个就选上！！

name: 该属性一定带上，因为后台程序接收数据必须使用name属性

rows: 可以输入几行

cols: 可以输入几列

                  : 提交按钮。把form表单的所有数据提交到后台程序处理。

value: 按钮文字显示内容 

 : 重置按钮。把form表单的数据还原为初始状态。

 普通按钮。本身不具备任何提交数据或改变数据的功能。

：隐藏域。需要传递数据到后台，但不希望显示该数据。传递编号

1.7 框架标签

1）框架集、框架集可以包含多个框架

2）框架。框架内包含页面

3）画中画框架。页面中包含其他页面