Web开发流程
Web开发主要流程有两种主流的开发结构：C/S架构和B/S架构。（客户端/服务器模式和浏览器/服务器模式）。
Web开发遵循流程：需求分许阶段、设计阶段、开发阶段、测试阶段、运行于运维阶段。
HTML
HTML;超文本标签语言，属于一种标签语言。
XML:可扩展标记语言。
XHML:可扩展超文本标记语言。
CSS
CSS:层叠样式表，用于控制网页样式允许将信息与网页内容分离的一种标记性语言。CSS能够对网页对象的位置排版进行像素记得精确控制，扩充了HTML标签的属性设定，使得页面效果表现更加灵活，更具有动态性。
标签
各种标签使用不能出现交叉现象。
<html></html>标签对标识HTML文档的开始和结束。
<head></head>描述HTML文档相关信息，如编码方式，网页标题。
<body></body>定义HTML文档中需要显示的实际内容，如文字、图片、标签。
<!-- -->里面可以添加注释浏览器运行后内容不会出现在页面。
<hn></hn>其中n的范围是1~6，数字越小字体越大，其中还可设置align属性设置对齐方式（左对齐，剧中，右对齐）。
<hr/>可设置一条线是个单标签，可设置属性width（水平线宽度），size（水平高度），align，noshade（去掉阴影）。
<b></b>与<strong></strong>标签使字体加粗。HTML5推荐使用<strong></strong>。
<i></i>与<em></em>标签使字体变为斜体。
<u></u>标签文本添加下划线（可能会混淆成超链接，尽量避免使用）。
<sup></sup>定义上标文本。
<sub></sub>定义下标文本。
<small></small>呈现小号字体效果。
<big></big>呈现大号字体效果。
<pre></pre>已经编排好的内容可保留其格式，按照原来编排方式进行呈现。
<a herf="url"></a>定一个超链接。target属性可以指明在何处打开超链接。
target属性:
_self浏览器默认设置，在当前窗口或同一框架载入连接文档。
_blank在一个新的未命名的窗口载入文档。
_parent如果是嵌套框架则在父类框架或窗口打开连接文档，如果不是则与_top相同。
_top在整个浏览器窗口中载入连接文档。
<img src="图片绝对地址">可在页面插入图片。
img属性：
src指定图片路径。
atl设置图片的替代文字（在图片没有加载出来的时候显示文字，或者加载成功鼠标指针在图片上显示描述文字）。
width，heigth设置图片的宽度和高度。
border设置图片边框，默认为四边无边框。
vspace，hspace设置图片垂直间距和水平间距。
align 设置图片与文字之间的排序。（值为left，right，top，botton，middle）。
<ul></ul>无序列表，每一个列表项使用标签<li></li>来定义。
<ul type=value>
<li>....</li>
....
</ul>
value值为disc（实心小圆点），circle（空心小圆点），square（实心小方砖）。
<ol><ol/>有序列表语法结构如下：
<ol type= value start=value>
<li>.......</li>
.....
<ol>
value可取1，2，3...|a,b,c...|A,,B,C...以及大小写罗马数字。
表格
<table></table>用来定义表格整个表格包含在<table></table>之间。
<tr></tr>用来定义表格中的一行，每行可以包含多个单元格。
<th></th><td></td>都放在行标签内，<th></th>定义表头，<td></td>定义普通单元格。
表格中常用属性：
width 表格宽度，单位为像素或者百分比。
height 表格高度，单位为像素或者百分比。
border 表格边框线宽度。
cellspacing 单元表间距。
cellpadding 单元表格内，文字与单元表格的间距。
aligen 水平位置。
valign 垂直位置。
background 背景图。
bgcolor背景颜色。
bordercolor 边框颜色。
rowspan 行合并。
colspan 列合并。
<table>
<tr>
<th>...</th>
...
</tr>
<tr>
<th>...</th>
</tr>
<tr>....</tr>
</table>
表单
表单区域用<form></form>标签来定义。
<form>标签的属性：
name: 表单的名称
method：定义表单数据从浏览器传送到服务器的方法，有post和get两种。
get提交方式将把数据发送到网页的URL地址中，属于运费隐藏式提交，而且允许传送的信息量一般小于1KB，但是床送效率高。
post提交方式是将材料本身当作主体来传送，属于隐式提交，此方式由于传送信息量较大的表单，缺点是传输效率慢。
一般，注册时用post，查询时用get。
action：定义表单处理程序的位置，如jsp文件、Servlet文件等。
<input type="text" name="field_name" maxlength="value" size="value" value="string">
文本框属性：
name：文本框名称。
maxlength：文本框最大输入字符数。
size：文本框宽度。
value：文本框默认值。
密码框：
<input type="password" name="field_name" maxlength="value" size="value">
单按钮与复选框：
<input type="radio" name="ll" checked="checked" value="string">
<input type="checkbox" name ="22" checkbox="checkbox" value="string">
如下图：
、 
列表是一种最节省空间方式，正常只能看到一种选项点击后会呈现所有选项。
<seclect name="select_name" size="number" multiple="multiple">
<option value="select_name" selected="selected"></option>
<option value="select_name" >选项名称</option>//可以设置多个选项
</select>
列表属性：
name:列表名。
size:显示的选项数目，1为下拉菜单，大于1则是列表框。
multipl:允许选项多选，删去则为下拉列表形式只能选一个选项。
value:选项值。
select:默认值。
文件框:浏览客户端文件上传到Web服务器。
<input type="file" name ="file_name">
隐藏域：在页面中对用户不可见，用来传送数据给web服务器。浏览者提交表单时，隐藏域的信息也会一起被发送到服务器。
<input type="hidden" name="field_name" value="string">
value为需要传的值。
按钮:
<input type="button" name ="filed_name" value ="普通按钮" >
<input type="submit" name ="filed_name" value ="提交按钮" >
<input type="reset" name ="filed_name" value ="重置按钮" >
图片按钮：
<inout type="image" name="field_name" src="image_url">
src为图片路径
多行文本域:
<textarea name="memo_name" row="value" cols="value" value="string">
多行文本域属性:
name:文本域名称;
rows:文本域的行数;
cols:文本域的列数;
value:文本域的默认值;
特殊符号表示法
< 表示 < 符号
> 表示 > 符号
& 表示 & 符号
"表示 “ 符号
® 表示 ® 符号
©表示 © 符号
表示 符号
·表示 · 符号
- CSS
1、内联样式：
直接写在标签元素的style属性中。
<p style ="color:#ff0000; font-size:12px;text-decoration:underline;" >
红色12像素带下划线字体
<p style ="color:#ff0000; font-size:12px;text-decoration:none;" >
红色12像素不带下划线字体
2、嵌入样式表：
将样式写在HTML文件中区域里的标签内。
<style>
h2{font-family:黑体; color:bold;font-size;12px;}
p{color;#0000ff;font-weight:bold;font-size:12px;}
<body>
<h2>样式表</h2>
<p>在网页中应用CSS样式表有三种方式：内联式、嵌入式样式表和外部样式表。
</p>
</body>
</style>
3、外部样式表：
文件以.css为扩展名，在中使用标签或@import关键字将外部样式表文件链接或导入到HTML文件中。单独写在一个独立的文件中有网页调用同一个外部样式表文件，因此能够实现代码的最大化重用及网站文件的最优化配置，还能保证网站风格一致性。
web.css
h2{ font-family:黑体;color:#ff0000;}
p{color:#0000ff;font-weight:bold;font-size:12px;}
HTML代码：
<head>
<link href="style/web.css" rel="stylesheet" type="text/css">
</head>
<body>
<h2>
样式表
</h2>
<p>在网页中应用CSS样式有三种：内联样式、嵌入样式表、外部样式表。</p>
</body>
href属性用于指定样式表文件所在的URL
rel=“stylesheet”表示链接的是外部样式表。
type="text/css"表示被链接文档的MIME类型是样式表；
使用@import指令：可以在标签里使用@import指令
<style>
@import"web.css"
@import url("web.css");
</style>
两者效果一样
颜色表示法
以十六进制表示RGB颜色
RGB：R（red红色）、G（green绿色）、B（blue蓝色）；
表示法规定为：rgb（red,green,blue）参数定义颜色强度介于0~255之间也可以是百分比。
rgb(255,0,0)=rgb(100%,0,0)=#f00;
RGBA颜色表示法：
表示法规定：rgba(red,green,blue,alpha)
alpha参数介于0.0（完全透明）~1.0（完全不透明）的数字。
CSS常用属性
font:在一个声明中设置字体的所有属性。
font:italic bold 12px/30px arial,sans-serif;
倾斜 加粗 字号 行间距 字体
font-family:设置文本字体 。
font-size:设置文本的字体大小。
color:设置文本的颜色。
font-style:设置文本样式。
font-weight:设置文本粗细。
text-decoration:用于设置文字下划线。
text-align:设置段落的水平对齐方式，属性值分别为left、center、right。
vertical-align:设置段落的垂直方式属性值分别为top、midlle、botton。
line-height:设置段落的行间距，em为相对行距。
text-indent:设置段落首行缩进;1em为一个字。
CSS的图片属性：
width:设置元素宽度。
height:设置元素高度。
background:在一个声明中设置所有的背景图。
background-color:设置背景颜色。
background-image:设置背景图片。
background-repeat:设置背景图片的平铺方式，属性值分别为：repeat(默认)、repeat-x、repeat-y、no-repeat。
background-attachment:设置背景图的滚动方式固定或者随着页面内容滚动。
CSS列表属性：
list-style:将所有列表属性写在一个声明中;list-style:square inside url("arrow.gif")。
list-style-image:将图像设置为列表项标志。
list-style-position设置列表中列表项标志的位置（属性值为：inside、outside、inherit）。
list-style-type:设置列表项标志类型。
1265
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
