2.基本的页面结构<!doctype html>——文档类型说明
网页根标记，页面<head> <head>网页头部</head>
<title>Insert a title</title> <title>网页标题</title>
<meta charset="utf-8">———指定网页编码格式为 UTF-8
</head>
<body></body> <body>网页主体</body>
3.快速创建网页模板 ctrl+shift+n
快速打开网页
4性和值：
属性—用来修饰元素的
<标记 属性=”值“ 属性=“值” ></表记>
举例
align 当前元素的文本的水平对齐方式
center 居中对齐
标准属性:
id 页面独一无二的标记
title 鼠标放到元素上时所以是的内容
class{css中用} 定义元素的类选择
style {css中用} 定义元素行内样式
5.注释
注释是不会被浏览器所解释运行的
注意 ：1.注释不能被嵌套
文本标记：
1.特殊字符
< <
> >
空格
©； ©
¥ ￥
2.文本样式
加粗 下划线 上标
斜体 删除线 下标
标题元素: n:1-6
3.段落元素–页面表示一段独立的文本
1.垂直空白 2.独占一块
4.独行元素
5.分隔线元素
在页面中显示线条
属性：1.size 尺寸，以px（像素）为单位 2.width： 宽度 3.align :线条的水平对齐方式 left，right，center
4.color 颜色
6.预格式化
保留源文档中格式，即保留源文档中所有的回车和空格 谨慎使用
7.块分区元素
为网页分组，实现网页布局
8.行内分区元素
设置同一块文本的不同样式
9.行内元素和块级元素
1.块级元素
默认情况下，每个块级元素独占一行，即元素前后都会换行
如：p,div,h1-h6,pre ……
作用：布局
2.行内元素
不会换行，可以和其他的行内元素或文本在一行内显示
如;span,s,b,i,u,sup,sub,……
作用：处理文本样式
######################################################################
1.图像和链接
1.URL
目录&目录结构
目录：WEB站点中文件夹的名称
目录结构：由目录以及目录形成复杂结构
2.URL 统一资源占位符
作用 ； 用来标识网络中资源的位置
资源：图片，网页，音视频
俗称:路径
三种表现形式;{1]绝对路径 {2}相对路径 {3}根相对路径
****路径详解
1.绝对路径 ：文件从最高级目录下开始的最完整路径
1.访问网络资源
（1）协议名称（2）主机名{IP地址，域名}（3）目录路径（4）文件名
例如： htttps：//www.baisu.com/img/bd_logo/.png
2.访问本机资源
从盘位位置处一层一层查找，直到找到文件为止
E:\HTML5BASIC\images\login.png
2.相对路径：资源是通过文件间的位置关系
{1}同目录，直接用 {2} 子目录，先进入 {3}父目录，先返回[…/]
3.根相对目录 永远都是从WEB站点所在的根目录处开始查找
##############################################################
图像
1.语法：
2.属性： 1. src 指定要显示的图像的URL 2.width 3.height 注意：等比缩放
链接
1.语法：内容
2.属性; 1.href 链接文件URL
2.target 目标： 打开网页的方式
取值： 1.self----默认值 2.blank—新标签页打开
3.链接有4种表现形式
1.目标文档为下载资源 xxx
2.电子邮件链接 xxx
3.返回页面顶部空链接 xxx
4.链接到JS xxx
4.锚点
1.定义锚点
（1）通过任何标记的id属性
（2）通过a标记的name属性
2.链接到锚点
#####################################################
表格
1.作用 将数据按照从左到右，从上到下大的顺序进行展示
2.语法 1.标记 （1）创建表格
(2)创建表行 --table row
(3)创建列 —table data
2.属性
（1）table
width height align border cellspacing cellpadding bgcolor
宽度 高度 对齐 边框 外边距-单元格和单元格 内边距-边距与内容距离 背景颜色
（2）表格行元素属性【tr】
align valign bgcolor
该行文本的垂直对齐方式（top/middle/botton）
（3）单元格元素属性【td】
valign width height bgcolor colspan（设置单元格跨列） rowspan（设置单元格跨行）
（4）表格中其他标记
【1】表格标题 标题 默认，标题在表格上方以居中方式显示
【2】行（列）标题 以特殊化的方式来显示每行中的第一个单元格或第一行中每列单元格的效果
th与td具备相同作用的，不同显示效果
特殊效果：1.水平居中·显示 2.文本加粗显示
##########################################################
表格复杂应用
1.行分组 【1】表头
[2]主体
[3]表尾
以上,每组都可包含多对
***不手动分组的话,默认都在中
2.不规则表格
[1]跨列 设tr的colspan属性 从当前单元格开始,横向向右合并几个(包括自己)
{2}跨行 设td的rowspan属性 --------------,纵向向下合并几个(包括自己)
3.表格的嵌套
一个表格中又嵌套了另一个表格,所有被嵌套的,只能放在td中
##################################
一，列表
按照一定顺序显示数据，默认从上到下的方式来显示数据，
（2）组成 ： 列表类型 列表项
1.语法; 有序列表
【1】语法
-
- 内容
- 内容
属性： 【1】type 列表前标识
取值： 1数字默认 a小写字母 A大写字母 i小写罗马数字 Ⅰ大写罗马数字
【2】start 指定列表项从第几个字符开始显示无序列表
标记;
列表项
属性;1.type
[1]disc 实心圆（默认） 【2】civde 空心圆 【3】square 实心方块 【4】none 没有-
列表的嵌套————实现多层列表
被嵌套的内容，必须放在li中
定义列表
【1】作用：定义情形
【2】语法;
定义列表中要解释的名词或术语
定义列表中对名词或术语的解释结构标记 ;用于表示页面中的布局，目的是为了提升标记中的语义化
【1】元素 定义文档的页眉 取代
【2】 用于表示页面的导航部分
【3】 用于表示页面中的主体部分
【4】 用于表示独立于文档的其他部分内容
【5】 表示网页底部信息
【6】 表示网页内容边栏信息###############################################################
表单
用于显示收集用户信息，并将信息提交给服务器
组成：
（1）表单元素：负责将用户数据提交给服务器
（2）表单控件：负责接收用户的数据（与用户进行数据交换）表单元素：
- 标记
2.属性 【1】action 定义表单被提交时的动作，主要就是服务器上处理数据的应用程序URL 默认提交给本页
【2】method 指定表单提交的方式
取值：（1）get（默认值） 向服务器端要数据时使用
特点：（1)显示提交 ;用户数据是可以显示在地址栏上的
（2）提交数据长度限制; 2KB(例子) —兼容性 （IE，谷歌）
（2）post 向服务器传递数据时使用 ——————安全性较高
（1）隐式提交 ：所提交的数据是看不见的
（2）无数据限制：密码等秘密一定要用post
（3）encype 表单数据进行编码的格式
（1）application/x-www-form-urlencided（默认值）
（2）multipart/form-data 上传文件时使用
（3）text/plain
表单控件 提供多种的表单控件，并且具备可视化的外观，可以接受用户的数据
input 组元素 textarea ，选项框（select，opton），其他元素
【1】input元素 或
属性：（1）type 根据type值，创建各种类型的输入字段，如文本框，密码框，单选按钮，复选框等
（2）value 值，要提交给服务器的值
（3）name 控件的名称，服务器端使用，没有名字，无法提交
（4）disabled 禁用控件，该属性无值，只要出现在控件中就表示禁用
##############################################################
input元素
1语法
2.分类
【1】文本框与密码框
文本框; type=“text” 密码框： type=“password”
属性：（1）maxlength 限制输入的字符数
（2）readonly 只读
（3）name 以控件的缩写+功能名称组成 文本框和密码框的缩写：txt
注意;都得有name属性
（4）value 在文本框中显示内容
【2】单元按钮和复选框
单选按钮：type=“radio” 复选框;type=“checkbox”
属性：（1）name 名称以及分组，一组单选按钮或复选框的话，名称必须一致
（2）value 值
（3）checked 设置默认被选中
【3】按钮
提交按钮 type=“submit” 重置按钮 type=“reset” 普通按钮type=“button”提交按钮 负责提交数据到服务器 重置按钮 将表单元素恢复到默认值 普通按钮 执行客户端脚本（js） 属性;(1)name btn (2)value 按钮上的显示文本【4】隐藏域和文件选择框
- 隐藏框 不想给用户看，但是要提交给服务器的数据
属性：（1）name 名称缩写 （2）value 值
2.文件选择框
提交（上传）文件时使用
属性：name 缩写：txt
（1）保证form的method 属性必须为post
（2）保证form的enctype属性必须为multpsrt/form-date###########################################################
textarea元素（多行文本框）
语法：
属性：1.name 控件名称 ，缩写txt
2.readonly 只读
3.cols 指定文本域的行数，变相设置宽度
4.rows 指定文本域的列数，变相设置高度选项框
1.下拉选项框
2.滚动列表
语法 创建选项框（滚动列表）
属性; (1)name 缩写 ：sel
（2）size 默认展示的选项数量，如果取值大于1的话，则为滚动列表
（3）multiple 设置多选
2. 选项框中的选项
属性;(1)value 值
（2）selected 预选中##################################
-----为分组指定标题 3.button元素———— 内容 注意： button元素放在中，就是提交按钮，放在之外，就是普通按钮（IE）除外
其他元素
1.label元素 ————关联文本与表单控件
属性：
for：表示与该元素相关联的表单控件的ID值
2.filedest元素————为控件分组
其他标记
内容 注意：必须是成对标记 2.当浏览器不支持元素时，将显示“内容”作为该处的内容 属性 1.src 浮动框架中的网页URL 2.width 3.height 4.frameborder浮动框架的边框，设置为0，则取消边框 2.摘要与细节————允许将页面某部分内容进行展开与收缩 用户信息 3.度量元素——用于显示静态比列的信息 文本 属性：1.min度量范围的最小值，默认为05. 2.max度量范围的最大值，默认为1 3.value当前显示的度量值， 4.时间元素——用于关联时间的不同表现形式 属性： datetime：关联的日期时间，可以只关联日期，也可以只关联时间。如果同时关联日期与时间的话，日期和时间用大写的“T来分割 ” 5.高亮文本显示——将页面中的某部分文本，以特殊的背景颜色显示出来
1.浮动框架
可以在一个浏览器窗口中同时显示多个页面文档1.Sublime Text
拼写检查，书签，完整的Python API，Goto功能，即时项目切换，多选择，多窗口等等。
2、Dreamweaver
，即可快速了解 HTML、CSS 和其他Web 标准。使用视觉辅助功能减少错误并提高网站开发速度
.3、Visual Studio Code
微软推出的带 GUI 的代码编辑器
4、HBuilder
支持HTML、CSS、JS、PHP的快速开发
5、WebStorm
继承了IntelliJ IDEA强大的JS部分的功能。
1、Bootstrap
2、Foundation
3、Cloud9 IDE
4、Notepad++
5、Visual Studio Code
6、GIMP、
7.SecureHeaders、
8.Fontello - 标记
2199
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
