第三章:html语言基础
html是构成网页最基础的要素，我们在开发asp.net的项目时，是把编程与html结合起来一起使用的，所以一 定学好html语言.在这一章中，我们要学习以下几点内容
1:标记的概念：
2:区域的概念：
3:标记的属性：
4:html文档结构
5:超链接概念：
6:段落的概念：
7:换行符的概念：
8:常用的html标记
9:在html文档如使用图像
10:在html文档中使用表格
11:在html文档中使用播放歌曲
12:在html文档中做滚动文字
13:表单与表单元素
14:表单元素的基本知识
标记的概念：
首先看一个简单的html文件：
<html>
<body gbcolor=red>
<head>
<title>我的确良</title>
</head>
<font color=yellow>我的中国心</font>
</body>
</html>
其中<html>,<head>,<title>等被称一个标记,这些标记都是有意义的，每一个标记就好像是给浏览器下一个命令，所以我们称这些为标记命令相当于"\n"是在换行一样。标记是用于控制html文档的内容和外观。html中的标记大多数是成对出现的(但不是全部)。一般是形如：<标记> </标记>
区域的概念
我们把<标记> </标记>这一整体被称为一个区域，区域的好处是让html具有结构性，可提高其可读性
标记的属性
有些标记是可以含有属性的。比如：
<body gbcolor=red>这个标记就是表示把窗体整个的背景色作为红色
html文档结构
html有三个基本部分
1:html部分，每个html文档必须以<html>标记开头，以</html>标记结束
作用：通知浏览器这两个标记之间的内容是一个html文档
2:头部分：形如：<head> </head>。此部分包含文档的标题标题包含在title标记内，以
<title>开始，以</title>结束
3:正文部分：跟在头部分之后的内容。正文包含所需要要显示在网页内的文本，图像，链接，表格等内容。正 文部分以<body>标记开始，以</body>部分结束
一般的html格式形如：
<html>
<head>
<title>标题</title>
</head
<body>
在这里写上html其它的标记
</body>
</html>
超链接概念
在浏览网页时，将鼠标光标移到某一段文字或图片上面，如果会出现"手指形"光标，就表示这是一个链接，在此按下鼠标会链接到另外一个网页
要设置超链接必须要使用<a>标记 其格式如下：
<a href="链接的目的对像">链接文本</a>
其中链接的目的对像可以为以下几点情况
1:链接到其它的文档 比如：<a href="test.html">我的链接</a>
2:链接到指定网站: 比如：<a href="http://www.163.net">我的网站</a>
段落的概念
在写文章时，我们可以把某些文字做成一个段。在html中也可以将原文某些内容组成一个段。
<p>用于标记新段落的开始。
比如： 这是我的希望<p>你是多么的快活
说明：标记<p>并没有对应的结束符合</p>请记住
换行符：
标记<br>用于在html文档中指定换行，<br>会在标记的位置添加一个回车符
比如：
<p>请跟我学习html语法基础<br>行吗?
<P>另一个段落的开始
常用的html标记
上一节谈了html的基本概念，这一节，我们要学习一下html基本的标记
1):设置文字外观的标记
A):<B>： 实现文字加粗<B>文字</B>
B):<I>: 实现文字的斜体
C):<U>: 给文字加下画线
D):<SUP>: 给文字设置成上标字
E):<SUB>: 给文字设置为下标字
F):<font>: 用来设置文字的字体,font标记通常带有属性(size,color,face(字体名字))
size:最大值为7,最小值为7
练习：
我是一只小小小鸟 (小字越来越来小,加粗)
想要飞也飞不高(第一，二个飞作为上标，高作为下标)
<html>
<body>
<font size=7>我是一只</font>
<b>
<font size=7>小</font>
<font size=6>小</font>
<font size=1>小</font>
</b>
<font size=7>鸟<p>
想要<sup>飞</sup>也<sup>飞</sup>不<sub>高</sub></font>
</body>
</html>
2):设置段落的样式标记：
a):<H1>--<H6>:这几个标记的用途是设置段落标题的大小级数。
<html>
<body>
<h1>标题第一级</h1>
<h2>标题第二级</h2>
<h3>标题第三级</h3>
<h4>标题第四级</h4>
<h5>标题第五级</h5>
<h6>标题第六级</h6>
</body>
</html>
b):<pre>:希望结果显示的文本与html源定义一致。
由于正常下，在浏览器会把多个空格当一个空格来处理，换行符不会作为换行符来对待
<html>
<body>
<pre> //不要pre试一下
for i=1 to 10
for j=1 to 10
printf("%d",i);
</pre>
</body>
</html>
c):使用水平标尺标记
<hr>有几个属性：
align:对齐方式
width:对齐宽度(用文档宽度的百分比)
size:粗细
noshade:不带阴影
在html文档中使用图像
img标记可以将图像插入到html文档中.语法为
<img src="带路径的图像文件">
属性：
align属性：用来说明图片的对齐位置但是align只能够取left,right不能取中间
下面的方法<center><img src="图像文件"></center>能够把图像放在文档中间
也可以利用图像来实现超级连接：
<html>
<body>
<p align=center> 我的留言板</p>
<a href="青鸟.html"><center><img align=center src="c:\a.bmp"></center></a>
</body>
</html>
在html文档中使用播放歌曲
<embed>
在html文档中做滚动文字
<marquee>标记
behavior:决定如何滚动
direction:滚动方向
scrollamount:每次移动的增量
在html文档中使用表格
1:<tabel>标记可以用来在html文档中创建表.
2:<tr>标记可以用来产生一行
3:<td>标记可以用来产生一列
原则：
每个<td>..</d>构成单栏数据，多个<td>..</td>放在<tr>..</tr>之间构成一行数据。
多个<tr>..</tr>放在<table>..</table>之间即构成一个表格
4:boder属性用于指定边框的宽度。如果将该值设为零，则不显示边框
6:<caption>标记用于添加表的标题:必须紧跟随在<table>之后的位置指定
7:align属性可以设置单元格,或某一行的水平对齐方式它的取值为left,right,center
8:valign性可以设置单元格，或某一行的垂直对齐方式它的取值为top,middle,bottom
9:bgcolor属性用来设置表格的背景色
9:nowrap不自动换行
10:witdh属性用来设置表格的宽度
1):以网页的显示宽度为百分比：
比如：<table width=80%>
2):指定宽度：
比如：<table width=350>
3):如果不设宽度，表格会自动以其中的文字为宽度
11:heigh:用来设置表格的高度
12:cellspacing属性用来设置单元格之间的间距
13:cellpadding属性用来设置单元格边界与内容之间的距离
比如:<table cellspacing=10 cellpadding=10>
练习：
创建不规格表格
1：通过colspan来指定单元格要跨多少列
2: 通过rowspan来指定单元格要跨多少行
3:一定要用在<td colspan或rowspan>中
什么是表单与表单元素(form)
1:表单就相当于vb里面的窗体,而表单元素就相当于一些控件。
所以表单可以看成是表单元素的一个容器,当用户在表单元素里面填写一些信息之后，
就可以直接把表单从客户端传给服务器，服务器那边就通过表单来获取其中表单元素的值
2:表单的标记是：<form> </form>
表单元素的基础知识
表单与表单元素都是属于Html标记，它们直接可以通过IE来解释，不需要通过IIS
所以表单与表单元素都是在客户端来运行的,这些表单元素一定要写在<form>与</form>之间
1:按钮：
<input type=button value="显示的文字 name="名字">
2:文本：
<input type=text name="名字" size=大小>
3:密码框：
<input type=password name="名字" size=大小>
4:复选框：
<input type=checkbox name="名字">显示的文字
5:单选按钮：
<input type=radio name="名字">显示的文字
6:下拉框元素：
<select name="名字">
<option value="文本" selected>项文本</option>
<option value="文本" >项文本</option>
</select>
评论