---------------------- Windows Phone 7手机开发、.Net培训、期待与您交流! ----------------------
静态页面:保存在服务器上的HTML页面。动态页面:服务器动态生成的HTML页面,从数据库中取需要的数据然后动态生成。
Html中
&nbmp 表示空格
< 表示大于号
> 表示小于号
<br/>回车aaa<br/>bbb<br/><br/><br/>
<p>aaa<p>
<p>bbb</p>
<p></p>表示段,并且前后会有很大的空白
<center></center>居中 <center>你好</center>
<h1></h1>到<h6></h6>定义了字的大小
<b>a</b>定义粗体
<font></font>字体标签<font color=”red” size=30 >红色</font>
超级链接 <a herf =”http://www.rupeng.com”>如鹏网</a>,还可以嵌套图片,即点击图片实现链接(注意不是插入)
/表示根目录
../表示父目录
..//..//表示父目录的父目录
没有/或者./表示当前目录
<a herf=”a.htm”><img src=”/images/cshap1.jpg”/></a>
图片的属性:border=0表示不显示边框,,制定width、height,即使没有加载图片完成也可先把位置站上
<tr>属性 align水平对齐方式,包括left right center
练习 1 登陆页面包括用户名,密码,验证码,记住密码和登陆
<head>
<title>登陆<title>
</head>
<body>
<table border=”1”>
<tr><td><label for=“username”>用户名:</label></td><td><input id=”username” type=”text”/></td></tr>
<tr><td><label for=”password”>密码:</label></td><td><input id=”password” type=”password”/></td></tr>
<tr><td><label for =”autocode”>验证码</label></td><td><input id=”autocode” type =”text”/><img alt=”验证码” title=”验证码” src=”/images/3.jpg”/></td></tr>
<tr><td clospan=”2”><input id=”remember” type=”checkbox”/><label for=”remember”>记住密码</label></tr></td>
<tr><td clospan=”2”><input type=”submit” value=”登陆”/></tr></td>
</table>
</body>
练习2 点击“同意“超链接实现向注册页面的转移,制作注册表单
<head>
<title>注册协议</title>
</head>
<body>
<textarea cols=”20” rows=”10”>注册本网站!!!!</textarea>
<p> //自动换行,实现对齐
<a href=” exam2.htm”>同意</a> //超链接,实现向注册表的转移
</p>
</body>
Exam2.htm
<head>
<title></title>
</head>
<body>
<table>
<tr><td><label for=”username”>用户名:</label></td><td><input id=”username” type=”text”/></td></tr>
<tr><td><label for=”province”>省份:</label></td><td>
<select id=”privince”> //建立省份的下拉列表
<option>山东</option>
<option>河南</option>
<option>辽宁</option>
</select>
</td></tr>
<tr><td colspan=”2”> //建立爱好的复选框
<fieldset>
<legend>爱好</legend>
<input type=”checkbox” id=”ds”/><label for=”ds”>登山</label>
</fieldset>
</td></tr>
</table>
</body>
CSS用来美化页面,用来描述元素的字体颜色,背景颜色,边框
css中样式(定义在<head></head>中)包括三种:标签(如input p等);class (前面带点,同时两种样式时用空格隔开)
标签使用实例如下:
<head>
<title></title>
<style type=”text:css”>
.waring{background:red; } //hightlight、waring为两个class
.highlight{font-size:xx-large;cursor:help;} //font-size也可用数字表示大小
Input accountnu{text-align:right;color:Yellow;}
Label accountnu{font-size:italic;}
#username //#后表示id选择器
{font-size:xx-large;
}
<style>
</head>
<body>
<-----------class选择器------------>
<div class=”hightlight”>你好!</div> //引用一个class
<div class=”hightlight waring”>你好!!!</div> //引用两个class中间用空格分开
<div class=”hightlight waring” style=”background-color:blue”>你好!!!</div>
// 使用class是可同时定义style,style覆盖class中的值,因此本句话背景为蓝色不为红色
<-----------标签+class选择器------------>
<input class=”accountnu” type=:text value=”aaaaaa”> //结果为黄色又对齐
<label class=”accountnu”>bbbbb</label> //结果为斜体
<-----------id选择器------------>
<input id=”username”type=”text” value=”12345678”/>//显示文字为xx-large样式
</body>
---------------------- Windows Phone 7手机开发、.Net培训、期待与您交流! ----------------------