软件体系结构: C/S 客户端/服务器 (如QQ,需要安装)
B/S 浏览器/服务器 (如 网页)
PHP 属于 B/S结构 .工作 :给予PHP的WEB开发.
B/S结构软件的优劣势:
-维护和升级方式简单
-成本降低,选择更多
-应用服务器,运行数据负荷较重
一、1、什么是HTML： 超文本标记语言，是由标签和内容（标签和节点）构成的。
2、HTML5文档的注释： <!--注释内容-->
3、HTML标签： 由“<” “>” 括起来。
双标签（成对）：<标签名>······</标签名>
单标签（不成对）：<标签名/>
推荐小写
4、HTML标签的组成部分： 属性、实体
属性是由属性名和值同时出现： <标签名 属性名1=“值” 属性名2=“值”··· 属性名N=“值”> </标签名>
HTML实体 "<" : <
">" : >
"空格" :
"引号" : "
"&" : &
5、HTML 文件的主体结构
1 <!DOCTYPE html> <!--类型说明，DOCTYPE声明必须放在每一个HTML文档最顶部，在所有代码和标识之上。-->
2 <html>
3 <head> <!--页面设置-->
4 <meta content="text/html; charset=utf-8" /> <!--格式中也要选择utf-8-->
5 <title>标题<title/>
6 <link type="text/css" rel=stylesheet href="**.css" /> <!--连接引入css文件-->
7 <script type="text/javascript" src="**.js"></script > <!--连接引入js文件-->
8 </head>
9 <body></body> <!--页面主体，浏览器显示-->
10 </html>
或者css样式和js全部写在页面里
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta content="text/html; charset=utf-8" />
5 <title>标题<title/>
6 <style type="text/css">写入本页的css样式</style>
7 <script type="text/javascrpt">写入本页的js样式,js文件也可写在body中</script>
8 </head>
9 <body></body>
10 </html>
6.HTML中的颜色：① 颜色单词：如：red 、blue、black
②六位十六进制 #000000——#FFFFFF（画图中，可提取或者ColorSpy的屏幕取色工具） 前两位是红色 中间是绿色 后两位是蓝色
如：白色为#FFFFFF（可缩写为#FFF）、红色为#000
二、HTML中的文本标签，格式化标签
1、文本标签
* ① <br/> 换行
* ② <p>···</p> 换段
③ <i>···</i> 斜体
* ④ <em>···</em> 强调斜体
⑤ <b>···</b> 加粗
* ⑥ <strong>···</strong> 强调加粗
⑦ <hn>···</hn> 其中n为1-6的值，标题标签（加粗，独立行）
⑧ <cite>···</cite> 引用
⑨ <sub>···</sub> 下标
⑩ <sup>···</sup> 上标
* ⑪ <del>···</del> 删除线
⑫ <bdo>···</bdo> 文本方向 例：<bdo dir="rtl">···</bdo> 或者 <bdo dir="ltr">···</bdo>
⑬ <abbr>···</abbr> 缩写
⑭ <details>···</details> 元素细节
⑮ <summqry>···</summqry> 包含details元素的标题
1 例：
2 <details>
3 <summary>HTML 5</summary>
4 This document teaches you everything you have to learn about HTML 5.5 </details>
<!-- 结果是：HTML 5 This document teaches you everything you have to learn about HTML 5.-->
⑯ <time>···</time> 时间
⑰ <dialog>···</dialog> 对话
⑱ <pre> 保留文字在源代码中的格式
2、格式化标签
* ① <br/> 换行
* ② <p>···</p> 换段
* ③ <hr/> 水平线
④ <font>···</font> 字体
例：<font size="5" face="arial" color="red">A paragraph.</font>
3、列表
* ① <ul> 无序列表 例：<ul type="square"> </ul> type类型值：discsquare circle
② <ol> 有序列表 例：<ol type="I"> </ol> type类型值：A a i I 1
<ol start="5"></ol> 起始值
* ③ <li> 列表项
④ <dl> 自定义列表
<dt>···</dt> 标题
<dd>···</dd> 内容
三、* HTML中的超级链接
属性：href target title
* <a href=""></a> 超级链接标签
* target： 表示打开方式
_blank 新窗口
_self 本窗口（默认）
_parent 父窗口
_top 顶级窗口
framename 窗口名
title：文字提示属性
锚点链接：
定义一个锚点： <a id="a1">内容</a> (以前使用 <a name="a1">)
使用锚点： <a href="#a1">跳转到a1处</a>
四、图片标签<img>
* <img/> 插入一张图片
属性：* src: 图片名以及URL地址
* alt：图片加载失败时才显示的提示信息、鼠标放在图片上提示的字、搜索引擎可以搜到图片
title：文字提示属性
width：宽度
height：长度
border：边框线粗细
<a href="·····"><img src="·····" /></a>点击图片链接到别的页面
五、多媒体标签（HTML 5标签）
<audio>声音 <video>视频 <source>媒介资源 <embed src=" ">嵌入的内容
<map> 客户端图像映射。图像映射（image-map）指带有可点击区域的一幅图像。注释：<area>永远嵌套在 <map>内部，<img>中的 usemap 属性可引用 <map> 中的 id 或 name 属性
例：
1 <img src="planets.jpg" border="0" usemap="#planetmap" alt="Planets" />
2
3 <map name="planetmap" id="planetmap">
4 <area shape="circle" coords="180,139,14" href ="venus.html" alt="Venus" /> <!--alt：替换文本，coords：坐标值，shape：定义区域的形状（圆形，多边形，矩形）-->
5 <area shape="poly" coords="129,161,10" href ="mercur.html" alt="Mercury" />
6 <area shape="rect" coords="0,0,110,260" href ="sun.html" alt="Sun" />
7 </map>
六、* 表格标签
<table>表格 <caption>标题 <th>表头标签 <tr>行标签 <td>列标签 <thead>表头 <tbody>表体 <tfoot>表尾
cellspacing 单元格之间的空间，默认为2px
cellpadding 文字与单元格之间的距离
<td>{colspan 横跨列数
{rowspan 横跨行数
{align 水平方向
{valign 垂直方向——{top middle bottom
col ：为表格中的一个或多个列定义属性值（不常用）
colgroup：定义表格列的组，对列进行组合（不常用）
1 <table border="1">
2 <caption>people</caption>
3 <tr>
4 <th>name</th>
5 <th>age</th>
6 <th>sex</th>
7 </tr>
8 <tr>
9 <td>Tom</td>
10 <td>20</td>
11 <td>boy</td>
12 </tr>
13 </table>
七、form 表单标签
1、<form> 表单
属性：* action：提交的目标地址（URL）
* method：提交方式:get(默认) 和 post
get 方式地址栏可见 长度受限制（IE 2K,火狐8k） 不安全
post 方式 地址栏 不可见 长度不受限制 相对安全
enctype：提交类型
target： 在何处打开
name：为表单起个名字，HTML5不支持，用 id 代替
2、<input> 表单项中的属性
* name ： 表单项名，用于存储内容值的。
* value： 输入的值
size： 输入框宽度值
maxlength：输入框 输入内容的最大长度
readonly：只读
* display：禁用
* checked：对选择框指定默认选项
accesskey：快捷键（IE：alt+键 火狐：alt+shift+键）
tabindex：通过数字指定tab键的切换顺序
* type：表示表单的类型，值如下：
text 单行文本框
Email: <input type="text" name="email" />
posswird 密码输入框,密码字段中的字符会被掩码（显示为星号或原点）
<input type="password" name="pwd" />
checkbox 多选框 ,输入value值
<input type="checkbox" name="shu[]" value="one" /> one
<input type="checkbox" name="shu[]" value="two" /> two
radio 单选框 ,输入value值
<input type="radio" name="sex" value="boy" /> boy
<input type="radio" name="sex" value="girl" checked="checked"/> girl
file 文件上传选择框
<input type="file" />
button 普通按钮，但没有任何行为。button 类型常用于在用户点击按钮时启动 JavaScript 程序。
<input type="button" value="Click me" onclick="msg()" />
submit 提交按钮
1 <form action="form_action.html" method="get">
2 Email: <input type="text" name="email" />
3 <input type="submit" />
4 </form>
image 图片提交按钮，必须把 src 属性 和 alt 属性 与 <input type="image"> 结合使用，默认具有提交功能。
<input type="image" src="submit.gif" alt="Submit" />
reset 重置按钮，返回第一次打开的时候
<input type="reset" />
hidden 主表单隐藏域，要喝表单一起提交的信息，但是不需要用户修改
<input type="hidden" name="id" value="1" />
3、<select> 标签创建下拉列表
* name：名称
size：定义菜单中可见项目的数目（html5不支持），出现滚动条
multiple：多选
* <option>：下拉选项标签，用于嵌入在<select>中使用
value：下拉选项的值
selected：默认下拉选项值
disabled：当该属性为true时，会禁用该项目
1 <select name="cars" multiple="multiple" size="2">
2 <option value="volvo">Volvo</option>
3 <option value="saab" >Saab</option>
4 <option value="fiat" selected>Fiat</option>
5 <option value="audi" disabled="true">Audi</option>
6 </select>
4、<textarea>多行文本域
* name：名称
* cols：规定文本区内可见的列数
* rows：规定文本区内可见的行数
disabled：是否禁用
readonly：只读
5、<button> 按钮
可放置内容，比如文档或图像
初次学习的HTML基础，做的笔记~~勿喷~~