文档类型
当我们用dreamweaver新建一下html格式文档时，查看源代码，会发现代码最上部有如下这句话：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
初学者都会不解这句话是什么意思呢？其实不必太在意这些，这句话只是用来标明本文档的要符合的标准类型的，这里用的是过渡类型，另外还有框架和严格类型，目前一般都采用过渡类型，因为浏览器对XHTML的解析比较宽松，允许使用HTML4.01中的标签，但必须符合XHTML的语法。许多朋友在制作页面时，往往喜欢把这句删除掉，在这里建议大家一定要保留这句话，删除它后可能引起某些样式表失效或其它意想不到的问题。
文档格式
整体来说网页文档主要是由一个个标签和相关属性文字说明等组合而成的。格式如下：
<html>
<head>{...}</head>
<body>{...}</body>
</html>
废话不多说，页面代码的格式如上，主要有两部分组成部分组成，head部分和body部分，整个网页上的内容都要出现在这两个部分里面或者与其有关。
head部分的信息一般是不显示出来的,但他是记录了你这个HTML文件的很多有用的信息的部分，很多js和样式以及站点信息都会出现在这里。而body部分是HTML文件的正文，是你要在网页中展现出来的内容。
语言编码
在head部分我们还会发现有这样一句话：
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
这句话是用来标示文档的语言编码。就像我们平时所说的汉语、英语一样。这里的gb2312告诉浏览器，本文档采用简体中文编码；还有一种常用的编码是UTF-8编码，它是国际通用的编码。不管我们采用哪种编码，有一点就是包含的css样式表和其它文件也必须和本文档的编码一样，要不就会出现乱码。
html标签
前面我们提到了标签，页面就是很多标签组合出来的，在上面的文档格式里我们也看到了以下内容
<html>{...}</html>
<head>{...}</head>
<body>{...}</body>
这些成对的就被称为标签。这样的标签还有很多：
<head>{...}</head>
<body>{...}</body>
<div>{...}</div>
<span>{...}</span>
<p>{...}</p>
......
这些标签都是成对出现的，还有一种标签是单一的，这些会在标签尾部加上/，比如上边出现的语言编码里的就是单一标签，这些标签也有很多：
<img src="" /> <hr /> <br /> .......
html标签在页面中都必须结束。成对的标签以“/标签名”结束，有些单一的标签在本身的结尾打上/来结束，这是xhtml代码编写的规范。
还需说明一点的是按xhtml规范，标签必须用小写。
head包含的标签说明
title是网页唯一标题标签 -title标签
base是网页默认打开方式声明标签 base
link是一个链接标签，包括外部css文件引用、js文件引用、favicon.ico图标引用等作用 link介绍
meta包含广泛的内容标签，如网页关键字、网页介绍、作者、网页编码、robots、自动跳转等声明及说明标签。 meta介绍
script是引入外部js文件作用
style直接嵌入网页的js或css文件标签。
body标签
1)body内容标签，在HTML只能使用或出现一次
2)通常网页内容都是放入body标签内容
3)网页内容开始与结束标签
4)通常我们在IE内容区看到的内容，都是放入在<body></body>之间
5)可以这样理解，要让内容在IE浏览器中显示，当然不能任意到处放，这里html规范规定有它的html语言语法，这个时候body标签解决了这样要求与规范！
CSS样式
CSS样式的加载：
加载css样式有以下四种
1、外部样式
<link href="layout.css" rel="stylesheet" type="text/css" />
这种形式是把css单独写到一个css文件内，然后在源代码中以link方式链接。它的好处是不但本页可以调用，其它页面也可以调用，是最常用的一种形式。
2、内部样式
<style>
h2 { color:#f00;}
</style>
这种形式是内部样式表，它是以<style>和</style>结尾，写在源代码的head标签内。这样的样式表只能针对本页有效。不能作用于其它页面。
3、行内样式
<p style="font-size:18px;">内部样式</p>
这种在标签内以style标记的为行内样式，行内样式只针对标签内的元素有效，因其没有和内容相分离，所以不建议使用。
4、导入样式
@import url("/css/global.css");
链接样式是以@import url标记所链接的外部样式表，它一般常用在另一个样式表内部。如layout.css为主页所用样式，那么我们可以把全局都需要用的公共样式放到一个global.css的文件中，然后在layout.css中以@import url("/css/global.css")的形式链接全局样式，这样就使代码达到很好的重用性。
css优先级
id优先级高于class
后面的样式覆盖前面的
指定的高于继承
行内样式高于内部或外部样式
总结：单一的(id)高于共用的(class)，有指定的用指定的，无指定则继承离它最近的
今天就说这么多了，更多内容明天继续，谢谢大家！
---
转载请注明本文标题和链接：《HTML和CSS基础知识简介一》
