带来一篇CSS网页计划：百分比举行背景图片定位

支持浏览器的向后兼容，也就是无论未来的浏览器大战，胜利的是IE7或者是火狐，您的网站都能很好的兼容。
此文为厥后的教程做展垫，转自这儿。百分数定位很成心思，能够完成不凡的效果。

年夜部分人应当习气于利用形貌性词语（left、top、center…）大概数值（20px、1em…）对背景图片定位，百分比大概对照罕用，罕见的有50%、100%等数值。比方但愿背景图片程度居中，间隔容器顶部20px，可使用

background-position:50%20px;

之以是不利用

background-position:center20px;

是由于相似这类形貌性词语和数值混用的情势不被W3C保举。（纯真的形貌性词语组合利用是没有成绩的，比方：background-position:rightbottom;）浏览全文...

利用百分比举行定位的优点是能够使用CSS的盘算功效，到达px定位所难以完成的义务。比方在一个宽高均为300px的容器中，利用

background-position:150px150px;

能够看到背景图片的左上角极点（坐标0,0）定位到了齐容器的中央点（坐标150px,150px）。




而把150px交换为50%，利用

background-position:50%50%;

看到的并非以下的效果



而是如许



可见，CSS盘算出了背景图片的中央点。这也能够注释为何我们在利用

background-position:100%100%;

定位的时分，图片被安排在容器的右下角，而并没有跑出容器。（假如利用background-position:300px300px;的话，背景图片会被移出容器）

一样，假如利用

background-position:20%20%;

会将背景图片的坐标点(20%,20%)定位到容器的坐标点(20%,20%)。

使页面的字体变得更漂亮，更容易编排，使页面真正赏心悦目。

由CS4版本开始，则转用WebKit排版引擎（亦即GoogleChrome和AppleSafari浏览器所用的排版引擎）作为网页预览。

HTML技术的不断发展和完善，随之而产生了众多网页编辑器，从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器（则原始代码编辑器）

Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH，专业网页图像设计软件FIREWORKS，并称为“网页三剑客”。

由CS4 版本开始，则转用WebKit 排版引擎（亦即Google Chrome和Apple Safari浏览器所用的排版引擎）作为网页预览。

Dreamweaver由MX版本开始使用Opera软件公司的排版引擎“Presto”作为网页预览。

Dreamweaver在所见即所得添加链接时，可以在选中文字后在属性栏中的链接栏中直接输入文件的地址即可。

还可以在Dreamweaver常用工具中选择超级链接，完成相应的填写即可。

使用所见即所得的接口，亦有HTML编辑的功能。它现在有Mac和Windows系统的版本。原本由Macromedia公司所开发。