1，颜色 color:#930;
2，文字大小 font-size:15px;
3，文字居中 text-align:center
4，插图片链接 <img src="#">
5，浏览器标题信息 <head> <title> </title></head>,
6，注释 <!-- -->,
7，分级标题<h1></h1> <h2></h2>
8，字体加粗<strong></strong>
9，斜体<em></em>,
10，单独设置文字样式 <span></span> <head> <style> color:blue;</style> </head>
11，引用 <q></q> :双引号
12，长文本引用 <blockquote ></blockquote> :让文本为缩进式
13，回车 <br/> :在需要还行的地方处添加
14，空格
15，分割线 <hr/>
16，地址显示<address></address>
17,加入一行代码语言 <code> </code>
18,加入大量代码 <pre> </pre>
19,添加列表 <ul> //没有前后顺序信息的列表信息
<li> </li> //一行
<li> </li>
</ul>
20,添加有序列表
<ol>
<li> </li>
<li> </li>
</ol>
21,独立板块 <div id="模板名称"> </div>
22,表格 <table> <tbody> <tr> //一行<th> //一列 </th> </tr> </tbody> </table>
23,表格的摘要 <table summary="简介文档">
24,表格标题 <table> <caption>标题文本</caption> </table>
25,网页链接 <a href="目标网址" title="鼠标滑过显示的文本">链接显示的文本</a>
26,在新建浏览器窗口中打开链接 <a href="#" target="_blank">click here! </a>
27,链接Email地址
1，邮箱地址 <a href="mailto:yy@qq.com">发送</a>
2,抄送地址 <a href="mailto:yy@qq.com?cc=xx@qq.com">发送</a>
3,秘密抄送地址 <a href="mailto:yy@qq.com?bcc=xx@qq.com">发送</a>
4,多个收件人、抄送、秘密抄送 <a href="mailto:yy@qq.com;xx@qq/com">发送</a>
5,邮件主题和内容 <a href="mailto:yy@qq.com?subject=发送电子邮件&body=你好">发送</a>
28,插入图片 <img src="#" alt="下载失败的替换文本" title="鼠标滑过的提示文本">
29,表单标签，与用户交互 <form method="传送方式" action="服务器文件"> </form>
30,文本框、密码输入框
<form>
<input type="text/password" name="名称(文本框的名字，便于后台调用)" value="输入框默认值" />
</form>
31，文本域，多行文本输入
<textarea rows="行数" cols="列数">文本</textarea>
32，选择框、复选框
<input type="radio/checkbox" value="值" name="名称" checked="checked"/>
当 type="radio" 时，控件为单选框
当 type="checkbox" 时，控件为复选框
同一组的单选按钮，name 取值一定要一致
33，下拉列表框
<select>
<option value="看书">看书</option>
<option value="旅游" selected="selected">旅游</option>
<option value="运动">运动</option>
<option value="购物">购物</option>
</select>
设置selected="selected"属性，则该选项就被默认选中。
<select multiple="multiple"> //下拉框具有多选功能
34，使用提交按钮
<input type="submit" value="提交">
type：只有当type值设置为submit时，按钮才有提交作用
value：按钮上显示的文字
35，重置按钮重置表单信息
<input type="reset" value="重置">
type：只有当type值设置为reset时，按钮才有重置作用
36，form表格里面的lable标签
label标签不会向用户呈现任何特殊效果，它的作用是为鼠标用户改进了可用性。如果你在 label 标签内点击文本，就会触发此控件。就是说，当用户单击选中该label标签时，浏览器就会自动将焦点转到和标签相关的表单控件上（就自动选中和该label标签相关连的表单控件上）
注意：标签的 for 属性中的值应当与相关控件的 id 属性值一定要相同。
<label for="控件id名称">
37.form标签
通俗的讲 form标签是用来进行表单提交用的
form标签里面的常见属性如下
action: 表单提交的地址, 肯定是要提交给某个服务器的,action的地址就是要提交的服务器的地址
method:以何种方式提交,常见的为get和post. 区别在于一个是明文(在url中显示),一个是暗文
第一次实际帮人家做网页的页面，操作起来也没那么容易。。
第一个问题，记事本写好后在保存为html后缀文件时还是出现了txt文本，其实是后缀被隐藏了，在多打一个html后缀就可以解决了。
顺便附上自己写的网页模板，方便以后直接copy
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>主页面</title>
<style type="text/css" >
#bodydiv{ position:relative; margin-left:95px; margin-right:95px;}
#body{
background-color:#ffffff;
margin-top:auto;
color: #996600;
font-family: "黑体";
;
}
.title{
float:left;
}
#bannerdiv{ position:relative;}
#bannertable{}
#centerdiv{ position:relative; padding-left:3px;}
#centertable{ }
#rootdiv{ margin-top:11px;}
</style>
</head>
<body>
<div id="bannerdiv" width="100%">
<img src="images\ssh.zetadata_01.gif" width="100%" height="100%">
</div>
</br>
</br>
<div id="centerdiv">
<table id="centertable" border="0" cellpadding="8px" align="center">
<tr>
<td rowspan="2" >
<div >
<font class="title" size="4" color="000000">热门活动</font></br></br>
<div style="border:1px solid #C0C0C0;width:490px;">
<div style="font-size:0;">
<a href="BaiMi.html" style="text-decoration:none">
<img src="images\ssh.zetadata_04.gif" width="490" height="278">
</div>
</br>
<font size="4" color="000000">"I Love EP"创意绘画展</font>
</br>
</br>
<font size="2" color="#C0C0C0">活动时间：2016-03-06 10:30-11:30</font>
</br>
</br>
</div>
</br>
</br>
</a>
</div>
</div>
</br>
</td>
<td rowspan="2" >
<div >
<font class="title" size="4" color="000000"></font></br>
<div style="border:1px solid #C0C0C0;width:490px;">
<div style="font-size:0;">
<a href="BaiMi.html" style="text-decoration:none">
<img src="images\ssh.zetadata_05.gif" width="490" height="278">
</div>
</br>
<font size="4" color="000000">科学梦想家夏令营动员大会</font>
</br>
</br>
<font size="2" color="#C0C0C0">活动时间：2016-06-06 10:30-11:30</font>
</br>
</br>
</div>
</br>
</br>
</a>
</div>
</div>
</td>
</tr>
</table>
</div>
<div id="centerdiv">
<table id="centertable" border="0" cellpadding="8px" align="center">
<tr>
<td rowspan="2" >
<div >
<font class="title" size="4" color="000000">往期活动</font></br></br>
<div style="border:1px solid #C0C0C0;width:490px;">
<div style="font-size:0;">
<img src="images\ssh.zetadata_08.gif" width="490" height="278">
</div>
</br>
<font size="4" color="000000">农行杯 我有一个公益梦</font>
</br>
</br>
<font size="2" color="#C0C0C0">活动时间：2015-12-06 10:30-11:30</font>
</br>
</br>
</div>
</br>
</br>
</div>
</div>
</br>
</td>
<td rowspan="2" >
<div >
<font class="title" size="4" color="000000"></font></br></br>
<div style="border:1px solid #C0C0C0;width:490px;">
<div style="font-size:0;">
<img src="images\ssh.zetadata_09.gif" width="490" height="278">
</div>
</br>
<font size="4" color="000000">私塾慧幼儿时装大赛</font>
</br>
</br>
<font size="2" color="#C0C0C0">活动时间：2015-10-01 10:30-11:30</font>
</br>
</br>
</div>
</br>
</br>
</div>
</div>
</br>
</td>
</tr>
</table>
</div>
</div>
</body>
</html>
2，
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>百米</title>
<style type="text/css">
body {color:grey }
body {text-align: center }
.txtcss1 {
text-align: left; /* 用于文字右对齐 */
font-size:18px;
color:#6c6c6c;
}
#bodydiv{ position:relative; margin-left:95px; margin-right:95px;}
</style>
</head>
<body>
<div width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
<img src="images\BaiMin_9_01.gif" width="100%" height="100%">
</div>
<table bgcolor="#c7cbca" width="100%" height="45" border="0" cellspacing="0" cellpadding="0" align="left">
<tr>
<td style="color:white" align="center">活动时间：2016-03-06 10:30-11:30 | 活动地址：邻瑞广场一楼露天</td>
</tr>
</table>
<textarea class="txtcss1" cols="120" rows="90" style="overflow-y:hidden;border:0">
一、活动背景和目的
随着经济社会的发展，生活节奏的加快，无论是社区还是居民都疲于工作，很多时候根本没有时间和意识发现身
边的美和孩子身上的艺术潜力以及培养孩子的环保意识，其实人人都是浑然天成的艺术家和生活家。通过组织此次
活动，希望可以让自己和自己的孩子都快乐的拥有一个属于自己心中的环保梦想。
此次活动也是为提高民众联络所和社区之间人文艺术环境，进一步营造良好的区域正能量的氛围，鼓励小朋友进行
艺术文化和环保行为的熏陶和感受，逐渐培养艺术美感和环保意识。
二、组织机构
1.主办方：苏州工业园区湖东社工委金鸡湖民众联络所
2.承办方：荣域社区居委会，邻瑞社区居委会，双湖湾社区居委会，滨湖社区居委会，邻瑞广场，中新苏州工业园
区置地有限公司，苏州工业园区湖东思塾慧文化服务中心
3.合作方：山姆会员店，浦发银行荣域支行，星美影院，嘉睿私塾，乐橙美术
4.媒体：苏州地铁报
5.参与者：金鸡湖区域的居民及其他感兴趣的居民
三、活动时间
发起时间：2016年2月18日
活动时间：2016年3月6日上午10:30-11:30
作品展出时间：2016年3月6日当天，以及4大社区巡回展出
四、活动名称
“I Love EP”百米长卷创意绘画展
五、活动规模
50个家庭
六、年龄定位
5-12岁小朋友的家庭
七、活动地点
邻瑞广场一楼露天空地（如果下雨活动在邻瑞广场室内负一楼）
八、活动流程
1.由金鸡湖民众联络所，邻瑞广场, 荣域社区居委会，邻瑞社区居委会，双湖湾社区居委会，滨湖社区居委会及思
塾慧发起线上线下宣传
2.荣域社区居委会，邻瑞社区居委会，双湖湾社区居委会，滨湖社区居委会及其他社区的居民可以提前预约报名
3.艺术展分为彩绘环节、颜料布绘环节、展示环节
?彩绘环节
2016年3月6日上午10:30-11:30，参加绘画的家庭可以用专业的（不会对皮肤有伤害）彩绘颜料自行或由老师帮助
进行面部彩绘，增加趣味性。
?颜料布绘环节
2016年3月6日上午10:30-11:30，50个家庭将集体在百米长卷上进行创意绘画。绘画最后会评选最具艺术性和创
意性的5个家庭颁发奖品。
?展示环节
2016年3月6日10：00-13：30展出百米长卷创意作品，之后在4个社区进行巡回展出。
苏州工业园区湖东思塾慧文化服务中心
2016年2月24日
技术支持：苏州泽它网络科技有限公司
</textarea>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>summer campe</title>
<style type="text/css" >
<!--p.leftmargin {margin-left: 5cm}-->
body {color:grey }
body {text-align: center}
</style>
</head>
<body>
<div width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
<img src="images\YellowBanner_01.gif" width="100%" height="100%">
</div>
<table bgcolor="#c7cbca" width="100%" height="45" border="0" cellspacing="0" cellpadding="0" align="left">
<tr>
<td style="color:white" align="center">|</td>
</tr>
</table>
</br>
</br>
</br>
</br>
<div id="centerdiv" style=" text-align:center;">
<font color="#A9A9A9">活动正在筹划中，尽请等待……</font>
</div>
</div>
</br>
</br>
</body>
<ml>
扫一扫
9009
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
