html基础知识
（1）标签介绍
<!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=big5" />
<title>網頁介紹</title>
<style type="text/css">
body{text-align:center;}
.cls{font:SimSun;}
#table1 td{
font:"Times New Roman", Times, serif;
font-size:16px;
}
#table1 tr{background-color:#FFFFFF;}
h1{font-weight:lighter;
}
input{background:url(blog_i_060706_ws_001.gif);}
#maincontent{width:778px;}/*注釋*/
.main{
height:100%;
width:500px;
float:left;}
.wizard{
text-align:left;
height:100%;
width:278px;
float:right;}
</style>
</head>
<body>
<div>
<h1>test</h1>
</div>
<div id="maincontent">
<div class="main">
<table id="table1" width="100%" border="1" cellspacing="0" cellpadding="0">
<tr>
<td>dfgfdsg</td>
<td>dfss</td>
<td>fdsf</td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</div>
<div class="wizard"><input type="button" style="width:70px;" size="20" value=" " /></div>
</div>
</body>
</html>
上面这段代码就是标准的网页构造。
注意：
建议大家不要用
font
标签，
w3c
已经不推荐使用了。
所有的标签以及属性建议大家都采用小写。
验证自己的网页中的CSS样式是否符合规范，大家可以去
http://jigsaw.w3.org/css-validator/验证。
这里注意的就是所有的标签都要闭合，例如：<span></span>，像有些标签之后一个的，例如br，那就写成这样，<br />,<input type=”text” />。
按钮推荐大家写成<button></button>。
下面是最简单的html的结构：
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
</head>
<body>
</body>
</html>
如果包含有style样式，这些样式应该放在head之间，不要到处放置，给自己以后寻找造成麻烦。
script脚本一般也放在head之间，一般都是写成这样：
<head>
……
<style type=”text/css”>
</style>
<script type=”text/javascript”>
</script>
</head>
大家可以在这段代码的开头看到这么一句话“<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">”，下面就对这个doctype作一下介绍。
什么是
DOCTYPE
上面这些代码我们称做
DOCTYPE
声明。
DOCTYPE
是
document type(
文档类型
)
的简写，用来说明你用的
XHTML
或者
HTML
是什么版本。
其中的
DTD(
例如上例中的
xhtml1-transitional.dtd)
叫文档类型定义，里面包含了文档的规则，浏览器就根据你定义的
DTD
来解释你页面的标识，并展现出来。
要建立符合标准的网页，
DOCTYPE
声明是必不可少的关键组成部分；除非你的
XHTML
确定了一个正确的
DOCTYPE
，否则你的标识和
CSS
都不会生效。
XHTML 1.0
提供了三种
DTD
声明可供选择：
·
过渡的
(Transitional):
要求非常宽松的
DTD
，它允许你继续使用
HTML4.01
的标识
(
但是要符合
xhtml
的写法
)
。完整代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
·
严格的
(Strict):
要求严格的
DTD
，你不能使用任何表现层的标识和属性，例如
<br>
。完整代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
·
框架的
(Frameset):
专门针对框架页面设计使用的
DTD
，如果你的页面中包含有框架，需要采用这种
DTD
。
完整代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
我们选择什么样的
DOCTYPE
理想情况当然是严格的
DTD
，但对于我们大多数刚接触
web
标准的设计师来说，过渡的
DTD(XHTML 1.0 Transitional)
是目前理想选择
(
包括本站，使用的也是过渡型
DTD)
。因为这种
DTD
还允许我们使用表现层的标识、元素和属性，也比较容易通过
W3C
的代码校验。
注：上面说的
"
表现层的标识、属性
"
是指那些纯粹用来控制表现的
tag
，例如用于排版的表格、背景颜色标识等。在
XHTML
中标识是用来表示结构的，而不是用来实现表现形式，我们过渡的目的是最终实现数据和表现相分离。
DOCTYPE
声明好以后，接下来的代码是：
<html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312">
通常我们
HTML4.0
的代码只是
<html>
，这里的
"xmlns"
是什么呢？
这个
"xmlns"
是
XHTML namespace
的缩写，叫做
"
名字空间
"
声明。名字空间是什么作用呢？
标明在所处的这个页面内所用到的标记属于那个命名空间
.
在不同的命名空间可以有相同的标记表示不同的含义
.
所以有必要写明标记是属于那个命名空间的 .
所以有必要写明标记是属于那个命名空间的 .
（2）css介绍
css全称Cascading Style Sheet（层叠样式表），至于css的优点这里就不介绍，与我们现在写程序没有太大的关系，有兴趣可以搜索一下相关文章了解一下。
css样式可以有3种方式引用：
1、通过link标签引用
<link href="css.css" type="text/css" rel="stylesheet" />，link标签一般写在meta标签后面。
2、在head的style中定义，可以参考上面例子的代码。
3、在html标签中直接写style属性，例如：
<input type=”text” style=”width:100px;” />
优先级依次递增，也就是说如果我在css.css中也定义了input的width属性，但在页面最终起作用的是style=”width:100px;”。
css定义可以采用“属性—属性值”这种对应的方式进行设置，width:100px与width=100px，都是正确的。
第一种与第二种的写法都是一样的，如下：
|
body{text-align:center;}
.
cls{font:SimSun;}
#maincontent{width:778px;}/*注釋*/
#table1 td{
font:"Times New Roman", Times, serif;
font-size:16px;
}
|
这里列出了常见的4种方法来控制样式：
第一种body就是直接控制body标签下的所有元素的样式，在这里就是所有元素都居中。其下属的元素无需作任何设置即可发生作用；
第二种就是常见的class=”cls”，就不作说明；
第三种就是设置id为maincontent的元素的样式，不过大家请牢记，页面中的元素的id不要有重复；
第四种就是设置id为table1下的所有td的属性，这种方式与第一种类似，只是它仅仅控制部分元素的样式。比如：我可以把第一个table的文字设置成红色，第二个table的文字设置成蓝色，用第一种方式无法实现。
用的频率最高的就是后3种，不过我们目前用过的也就是第二种，其实其他2种也是很好用的。
用css控制的话，页面完全可以实现的很漂亮，大家可以看一下
http://blog.sohu.com/business这个网页，就是利用了众多的css样式来实现的。
也许大家现在的css掌握的不是很好，但大家尽量使用css来控制，不要一个页面打开就是一个table，然后在table中进行布局，这样有很大缺陷的，table即使border、cellspacing、cellpadding全部都设置为0，那这个table也是会有宽度的。
从这个图就可以看出这些table没有对齐，其他的就需要各位自己体会了。
（3）javascript
这个东西大家都比较熟悉，简单的大家都了解一些，就是说一下注意的地方。尽量不要去使用只有ie支持的函数，例如：document.all，可以使用document.getElementById,document.getElementsByName来替换。
请记住在页面不要使用重复id，如果同时设置了id与name的话请保持一致，避免ie的bug。
document.getElement
sByTagName与document. getElement
sByName得到的都是对象数组（即使数组中只有一个对象元素），而document.getElementById仅能得到最后一个对象（如果id相同的话）。
7284
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
