html:超文本标记语言
1. 可以做网页
2. WebAPP
3. 游戏
4. 手机APP
5. 后端设计
6. 后缀名必须是.html
格式:三段式
<!DOCTYPE html> 声名文件格式是html
<html lang="en">
<head> 头部标签
<meta charset="UTF-8">
<title>写入标题</title>
</head>
<body> 身体标签
</body>
</html>
B/S和C/S软件结构
1. B/S是浏览器服务器 ， C/S是客户端服务器
2. B/S模式是靠应用层的http协议进行通信的（当然也靠底层的好多协支持），一般不需要特定客户端，而html:超文本标记语言
1\. 可以做网页
2\. WebAPP
3\. 游戏
4\. 手机APP
5\. 后端设计
6\. 后缀名必须是.html
格式:三段式般要求有特定客户端，比如说QQ就是C/S模式，你的桌面上的QQ就是腾讯公司的特定客户端，而服务器就是腾讯的服务器.
网站工作原理
1. 网址：www.taobao.com
2. IP地址：192.168.105.250
网址转换为IP地址 DNS服务器
APP：服务器，工作原理
3. HTTP协议
http://www.baidu.com/b.php
http://网传输协](http://xn--dpqv5hv83cyun/)
www.soso.com.cn 域名(对应IP地址)
b.php 文件名
4. HTTP：超文本
5. https:网络传输协议前端和后端.全栈
6. 计算机语言 Java C C++ C# PHP等
7. 机器语言 汇编语言 高级语言
8. 浏览器
主浏览器：chrome firefox IE opera Safari
壳浏览器：搜狗 360 百度 UC等等
基本语法-标签属性
标签:单标签;双标签
属性:用来修饰标签
颜色
RGB(Red Green Blue)计算机三原色 rgb(0~255 0~255 0~255)
十二进制表示法:#fac #121c90
英文单词
注释
<-- 多行注释 -->
//单行注释
1. a标签 超链接标签
属性 href=" 要跳转的地址" ./当前目录 ../上级目录 绝对路径https://........
target=""
- _blank 新窗口打开 *
- _self 当前窗口打开(默认)
其他功能: 1.跳转:url 2.:邮件: email:邮箱地址 3.tel打电话 4.sms发短信
<a href="mailto:fuming@lampbrother.net">发邮件</a>
2. div标签
<div>div块状元素</div>
3.img标签
<img src="填入要插入图片地址">
4.p标签
<p>段落标签 单独表示一段落</p>
5.font标签
<font>字体标签</font>
字符实体:
空格 小于号< < 大于号> > 和号& & 引号" "等
6.style标签
位于head标签里面 用于定义文档HTML样式的信息
属性:type="text/css"*
7.link标签
外部连接样式表 定义文档与外部资源的关系
属性:href="" 规定被连接文档的位置
type="" 规定被连接文档的类型 stylesheet 默认值 shortcut icon 显示图标
medie="" 规定连接文档将被显示在什么设备上
screen 默认值 在计算机上显示 print打印的时候才显示这个样式 all表示全部
8.script标签
<script>用于写JS脚本</script>
9. hr 格式排版标签 代表分割线
10. pre 元格式输出标签
11. ul 无序列表 ol 有序列表
常与li连用 <ul> <ol>
<li> 无序列表</li> <li>有序列表</li>
</ul> </ol>
属性:type="circle"空心圆点 type="a"从a开始 reversed 列表倒序
12.锚点:快速定位页面中需要定位的位置
1.在需要的地方找到一个定义的a标签 命名name或者id 值任意
2.在查询的a标签里面写# 后面跟着name或者Id定义的名称即可实现跳转
属性 name="" 声名锚点 <a name=""></a> 内部使用<a href="#锚点名"></a>*
<a href="#b1">跳转到b1的位置</a>
<a name="a1"></a>
<div>点击那个连接时会跳转到的地址</div>
<a name="b1"> </a>
<div>点击id的那个连接时会跳转的地址<div>
13.图像
<img />单标签
常用属性: src 代表一个资源地址(就是图片地址)
alt="如果无法显示图像 浏览器将显示代替文本"
boder="" 给图片加边框 单位:px
width="" 图片宽度 height=""图片高度 注:宽度和高度不能同时使用 否则会失真
title="" 图片提示字
路径 相对路径./img/1.jpg 绝对路径https://........jpg 根目录/ 注:路径里面不能出现中文路径*
<img href="./img/1.jpg title="这是图片" border="1px" alt="加载失败" width="200px"
图片映射
<map></map>双标签 地图 与<area />连用*
area 区域 属性 shape="rect" 填写形状 矩形 rect circle poly
coords="0,0,56,78" 填写坐标地址 左上角的坐标和右下角的坐标
href="" 填写映射区域点击跳转的地址
文本标签
<em>em 加粗表强调</em>
<strong>strong 也是表强调</strong>
<cite>cite 表引用 书籍名 电影名等</cite>
<dfn>dfn 表示一个项目</dfn>
<code>var a = 1 + 1</code>code 表示代码
<samp>samp 简单强调</samp>
<abbr title="大傻逼">DSB</abbr> abbr 自定义缩写
<del>del 删除线</del> <ins>ins添加的</ins>
<bdo dir="rtl">你好阿</bdo>
<bdo dir="ltr">你好阿</bdo> bdo 控制文字输出方向
<var>var 定义变量</var>
<small>small 小型文字</small>
<b>b 加粗表强调 </b>
<i>i 斜体字标签</i>
<u>u 字体下划线</u>
sup 上角标 sub下角标
12<sup>12</sup>=144 H<sup>2</sup>O
<q>q 表示引用 ,加引号</q>
<blockquote>blockquote 长段引用</clockquote>
<address>address 表示地址 斜体表示</address>
<font>font 字体标签<font>
<tt>tt 打字机文字 小型</tt>
<strike>strike 删除线</strike>
表格
基本概念
行 单元格
<table>表格标签
属性:
caption 标题 colspan合并列 rowspan合并行
boder 边框 单位:像素px 默认值为0 无边框
width 表格的宽度 单位:像素或者百分比
height 表格的高度 单位:像素或者百分比
aligh="" 表格位置 left居左 center居中 right居右
bgcolor 表格的背景颜色
background 表格的背景图片
cellsacing 单元格间距`边距 单位px 默认值2px
cellpadding 单元格内边距 单位px 默认值1px
tr代表html表格中的行
td代表html表格中的列
th代表html表格中的单元格 有特殊样式 加粗字体且居中显示
属性:
align 内容水平位置 left居左 center居中 right居右
valign 内容垂直位置 top居上 middle居中 bottom居下
bgcolor 背景颜色
height高度/width宽度
使用表格制作简历
表单
form表单
属性: aciton 必填,用什么方式 get post
默认get 通过地址栏的方式把数据提交过去
post 相当于get脱离地址栏 通过类似隐藏的方式提交过去
input表单项 隶属于from表单(想写input必须使用form表单包裹 否则无法提交)
属性: name 此表单项的名称
value 此表单项的默认值
type="" 此输入域的显示类型
text: 普通的文本域
password: 密码域
radio 单选框 只能选择一个且必须选择一个
注: 单选框里面的name值必须一致 这样才会有相互排斥的效果
选中使用关键词checked
checkbox: 复选框 可以不选择或者选择多个
注: 复选框name值也要保持一致 并且在name值后面加上[] 选中使用关键词cheked
file: 可以选择一个文件路径
reset: 重置按钮 可以把表单内容清空恢复默认值
submit: 提交按钮 表单填写值传递给服务器
button: 普通按钮 多数用于JS
image: 自定义图像按钮
hidden: 隐藏域
select元素 与option元素套用 显示下拉框
optgroup元素套用 也是下拉框 把option分组
textarea元素 属性 name rows cols
fieldset
legend
表单标签
<from> action="" method="get/post" target=""
<input> type="" name="" value=""
文本域: <input type="text" name="" value="">
密码域: <input type="password" name="" value="">
单选框: <input type="radio" name="" value="值">checked
复选框: <input type="checkbox" name"" value="值"> checked
提交按钮: <input type="submit" value="按钮内容">
重置按钮: <input type="reset" value="按钮内容">
普通按钮: <input type="button" value="按钮内容">
图片按钮: <input type="image" src="图片地址" alt="">提交按钮
隐藏域: <input type ="hidden" name="" value="">
<select> 下拉列表
属性: name=""
配合option
<option> 下拉选项
属性: value selected
<optgroup> 给下拉列表分组
<textarea> 文本域
属性: name="" rows="" cols=""
<button> 按钮 默认是提交按钮
属性 type="submit/button"
<fieldset>
<legend>
所有的表单控件都具有的属性: disabled enabled
分帧标签
framset 代替body标签定义框架页面 并且定义框架页面有多少行列
属性: cols 定义框架页面含有多少行 与列的大小
rows 定义框架页面有多少行 与列的大小
每个值使用逗号分离 值可以是像素或者百分比 *代表剩下的所有值
frame 定义frameset标签里面每个框架页面的内容
属性: src="" 定义内容页 URL
name 在一个框架连接得到另一个框架时候定义的名字
<iframe></iframe>
<frameset>
<frame>
<onframes>
程序
<scrpt>
<noscript>
<object data="">
<param>
