---------------------- Windows Phone 7手机开发、.Net培训、期待与您交流! ----------------------
所有内容都包含在<html></html>内,<head></head>是页面的头部信息,<title></title>是标题栏信息,title必须在head内,<body></body>是页面的主体.
<pra>可以输入空格<pra>
在所有页面中都必须有这个部分,由于现在的浏览器贞错性强,即使在不写这些内容,页面也能正常显示,但最好养成习惯写完整.
Body有一个bgcolor的属性,修改网背景颜色.
Html和Xml的联系与区别
Html中的特殊符号:
Html中不把” ”当成空格,当成空格的话影响排版,html中的空格用 表示.
<(小于号,less than) >(大于号 greater than)
文件格式的标签:
<br/>回车,<p>是分段,<p>前后会有大段空白,而<br/>则没有.
<center>耒阳</center>居中显示
H标签,在html中定义了<h1>、<h2>、<h3>、<h4>、<h5>、<h6>六个不同的标签,分别表示不同的字体
<b>a</b>字体加粗
<font></font>字体标签,<font color=”red”>红色</font>,<fontsizi=”30”>字体大小</font>
URL超链接
<ahref="http://www.umiwi.com">优米网</a>
<a>中还可以嵌套图片
<a>的target属性设定为”_blank”就是在新窗口打开页面
超链接深入
“/”表示根目录. “../”表示父目录 “../../”表示父目录的父目录.
“./”或者不写任何斜线表示相当于当前路径的目录,
<img src="a.jpg">注意图片是链接的,不是插入的,所以如果src指向的文件被删除了,就不能观看了.
alt为图片无法显示时显示文字
border属性为图片边框,border="0"为不显示,width和height指定图片的大小
列表和表格
<table></table>建表
<tr></tr>建行 属性:align,水平对齐,可选值left(左对齐),right(右对齐),center(居中对齐);
valign,垂直对齐,top(顶端对齐),middle(中刘对齐),bottom(底部对齐)
<td></td>建单无格 属性:属性同上
<thead></thead>指定表头
还可以使用rowspon,colspan进行单元格合并,表头用th这样表头会居中加粗 colospan="2"合并两个单元格
<html>
<head>
<a href="http://www.umiwi.com" target="_blank">优米网</a>
<img src="D:\我的文档\20110110.jpg" width="50" height"50"></imng>
<ul><il>显示</il><il>dsdd</il><il>显示</il></ul>
<table border="1">
<tr><td>姓名</td><td>年龄</td><td>性别</td></tr>
<tr align="center"><td><font color="red">shuaige</font></td><td>22</td><td>男</td></tr>
<tr><td><a href="http://www.baidu.com" target="_blank"><font color="red">百度一下你就知道</font></a></td><td>未知</td><td>娘</td></tr>
</table>
</head>
</html>
表单
<from>标签为表单标签,如果需要把数据提交到服务器中,则要将<input> <textarea> <select> 等表单元素放在from中
<input>是主要的表单元素, type的可以选值, text(文本输入框) checkbox(复选框) button (普通按扭) submit(提交按钮) image(图片框)
password(密码输入框) file(文件选择框) radio(单选 按钮) reset(重置按钮) hidden(隐藏字段)
submit:默认按钮名称为提交可以通valus="按钮名"来更改名称.
text: size属性为宽度 maxlength为最长字符数 value为值 readonly设为只读属性
checkbox: checked属性是否选中(有且只有一个属性)
radio: 可以用name属性来进行分组(实现一组对中只能选中其中一个)
file: 用到file则 需要把from的enctype属性设置为multipart/from-data ,mothod属性为post
image: 用src属性来指定按扭的图片
对于只有单一属性值的属性,可以只写属性名(标准的写法需要写全,也推荐写全)
缩略图,通过两个图片来实现,单点击小图,转到大图
<select>标签 用来创建类似于winfrom的ComboBox(下拉列表)和ListBox(列表)
通过改为size的值来确认列表类型,size>1为ListBox(size的值为显示的数量),否则就是ComboBox
multiple属性就是多选ListBox(显示全部列表项),可以选多个项
select中option
<option>"所有添加的项"<option> option中有一个value的属性为程序员看到的值,"添加的项"则是给用户看的值
option中设默认选中的值属性为selected="selected", 不让选中把value="-1"设置为-1
select中的optgroup 给几个项分组
<optgroup label= "zuming">
<option>sds</option>
</optgroup>
其他标签
<textarea>多行文本框(也是表单元素)
<textarea>文字</textarea> rows cols 表示行数和列数
<label> 在 <input type="text">前面可以写修饰的普通文本,用户单击文本并不会使input得到焦点,这时候就需要用到label,使用lable的
for属性指定要修饰控件的id <bale for="id">
<fieldset> GroupBox效果 将控件划分在一个区域内
<fieldset>
<legend>相当于标题<legend>
<input type="text"/>
</fieldset>
样式表 CSS(层叠样式表)
CSS, 用于美化页面用的, 对页面元素进行描述 字体大小 颜色 背景色 边框 等等的设置
CSS 主要有 元素内嵌 页面嵌入 和 外部引用 三种方式,
元素内嵌,直接将元素写入style属性中,例:<input type="text" readonly="readonly" style="background-colo:#FF00FF"/> 适用于样式没有复用的场合
页面嵌入: 在<head>头内写入
<style type="text/css">
input{border-color.Yellow;color.red;}
</style>
表示页面内的所以input都用指定的样式,适合于样式复用,减小页面体积
外部引用,将CSS内容写到.css后缀的文件中
textarea{background.yellow}
在页面中引用,head头部中加入
<link type="text/css" rel="stylesheet" href="s1.css"/>
适用于多个页面共享CSS
在Css写的方法 控件名{ 属性}
div(层) span(块)
div 把多个内容包成一个整体,可以把div当成一个整体来处理,比如隐藏,移动,修改
span 也是把多个内容集合成一个整体, 当只占被包的内容区域,不会改变原始的排版,div则占整行
div是把内容放在一个矩形中,会影响整体布局,而span是把一段内容定义成一个整体,不会影响布局.显示
常见样式
css计量单位:css中表示高度,距离时有多种计量单位:px(像素) 30%(百分比) em(相对单位)等.
background-color:red背景颜色; color:文本颜色
border-style;solid 边框风格(默认没有边框),实线 还有dotted(点)等值; border-color 边框颜色 border-width:3px边框宽度(默认为0)
display: 元素是否显示,可选值none(不显示) block(显示为块级元素,此元素前后会事有换行符) inline(显示为内联元素,元素前没有换行符)等.
cursor,鼠标在元素上时显示的光标图片,可选值:cursor(默认光标) pointer(超链接上的手) text(输入bean)
wait(忙 沙漏) help(帮助)等.
LI不显示圆点. LIST-STYLE-TYPE:none;一般设在N或UL上\
样式选择器
对于非元素内联的样式需要定义样式选择器,通俗的说就是这个样式适合于哪些元素,三种:标签选择器 class选择器和 id选择器
标签选择器 input{border-color:yellow;color:red;},对于指定的标签采用统一的样式,
calss选择器 以义一个命名的样式,然后 在用到它的时候设定元素的class属性为样式的名称,还可以同时设定多 个class,名称之间加空格(类似于C#的中类的调用)
样式名称开头加"."
<head><tile></tile>
<style>
.ziti{font-size:xx-large}
</style>
<table><tr><td class="ziti">dlkfdsl</td></tr></table>
</head>
标签+class选择器
class选择器也可以针对不同的标签,实现同样的样式名对于不同的标签有不同的样式,只要在样式名前加标签名即可.
input.accountno{text-align:right;color:red;}
label.accountno{font-style:italic;}
<input class="accountno" type="text" value="1111">
<label class="accountno">3333</label>
id选择器
为指定的id设定样式,id前加#
#username
{
font-size:xx-large;
}
<div id="username">要显示的文字</div>
style class可以同时组合使用
<input id="username" calss="accountno" style="font-size:xx-large" type="text" value="sdfs"/>
更多选择器
@关联选择器
p strong{background-color=:yellow}
表示P标签内的strong标签内的内容使用的样式
<strong>分水岭</strong>
<p><strong>sdfsd</strong></p>
组合选择器,同时为多个标签设定一个样式
H1,H2,input{backgournd-colo:green}
<h1>nihao</h1>
<input type="text" value="test"/>
伪选择器:为标签的不同状态设定不同的样式:
A:visted: 超链接点击过的样式; A:active: 选中超链接时的样式; A:link: 超链接未被访问时的状态; A:hover: 鼠标移动超链接时的状态.
A:visited{text-decoration: none}
A:active{text-decoration: none}
A:link{text-decoration: none}
A:hover{text_decoration: none}
html中注释用<!--注释文字-->
---------------------- Windows Phone 7手机开发、.Net培训、期待与您交流! ----------------------