position的定位和float的定位有什么区别呢？

首先position一般分为relative和absolute，相对定位的元素使得元素“浮”了起来，就是说z-index大于0的，应该是1，所以不论它怎么进行移动却总是覆盖普通文档流元素，而且定位可激活z-index，可以对其设置z-index层叠关系，而且相对元素是保留了自己的占位信息，普通文档流中的元素不会认为它不存在，它的移动方式是以自身为基准的，移动方式为left right bottom top ，

而绝对定位元素首先它是脱离了文档流，而且并没有保留占位信息，但是也大于z-index，普通元素不认为它存在，它的定位方式是以附近祖先元素或者父级元素设置了定位以基准的，如果无，则body，而且absolute会改变元素的display类型为inline-block，

浮动定位，可以说明他是脱离了文档流，而且z-index在0这一层，定位方式为left right，直到碰到它的包围框或其他浮动元素为止，它也可以改变元素的display类型为inline-block，但是对absolute、float设置display类型是无效的，最后，文本元素并不会覆盖浮动元素。详细说明的话就复杂了，先不说了。

好了，这些就是它们的基本区别，打的真累

层叠样式单写好后，放在什么地方呢？大体说来有三种方式，一种是外部文件方式；一种是内部文档头方式；另一种是直接插入式。三种方式各有妙用，主要的差别在于它们规定的风格使用的范围不同。我们分别讲述：

一、外部文件方式

外部文件方式即将CSS写成一个文件的方式，在HTML文档头通过文件引用来进行风格控制。CSS文件可在DreamWeaver的Window菜单下的styles选项或在FrontPage Editor98中Format菜单下StyleSheet菜单项来创建，相对说来，在DreamWeaver下创建比较简单；当然了，如果你熟悉CSS属性，可直接在记事本里写，最后的文件扩展名为CSS。

CSS文件的引用是在HTML的标志之间写下列语句：

＜Link Rel="STYLESHEET" Href="文件名.CSS" Type="text/css"＞,如当前文件目录下有一CSS 文件名为myStyle.css，内容如下：

P{font-family:'宋体'
　　font-size:9pt;
　　color:blue}

H2{font-family:‘宋体’
　　font-size:13pt;
　　color:red
　　}

则在引用是，用下列语句:

＜Link Rel="STYLESHEET" Href="myStyle.css" Type="text/css"＞，当然，如果你在DreamWeaver中用styles功能可直接连接(Link)一个CSS文件，这些语句会自动生成的。

应用CSS文件的一个最大好处就是，你可以在每个HTML文件中引用这个文件，从而可使整个站点的HMTL文件在风格上保持一致，避免重复的CSS属性设置；另外，当你遇上改版或作某些重大调整要对风格进行修改时，可直接修改这个CSS文件，当然了，HTML文件一直引用最近更新的样式单，而不必每个每个HTML文件进行整，你说是不是挺方便的呀！特别提醒一下，如果你想建立自己的网站，这方面不可忽视哟，如果在建站之初没有网站风格的统一规划并形成CSS文件，以后内容一多，想调整一下风格会累死你的。

二、内部文档头方式

这种方式与外部文件方式区别在于这种方式是将风格直接定义在文档头之间，而不是形成文件。这种风格定义产生作用的范围也只局限于本文件，其格式如下(套用上边的CSS)

＜Style Type="text/css"＞

＜!--

P{font-family:'宋体'
　　font-size:9pt;
　　color:blue}

H2{font-family:‘宋体’
　　font-size:13pt;
　　color:red
　　}

--＞

＜/Style＞

如果在DreamWeaver中用Styles来书写，以上一些代码会自动生成的。 这种方式的主要用处是，在一些方面统一风格的前提下，可针对具体页面进行具体调整。这两种方式并不相排斥，而是相互结合，比如在CSS文件中定义了P标志的字体大小font-size为10pt,而在内部文档中可定义P标志字体颜色font-color为Red;而在另一个HTML文件中定义颜色为Green，从这里，你也可能明白为什么风格样式单叫层叠式样单了。

鹏仔微信 15129739599 鹏仔QQ344225443 鹏仔前端 pjxi.com 共享博客 sharedbk.com