CSS教程之网页制造进修教程:CSS Position
这工具比表格好的唯一就是你可以定义一个ID，想怎么玩它就怎么玩他，表格用来处理显示数据，DIV+css+TABLE就行了，都什么年代了，以前没有DIV，而且386的年代不也一样，现在都奔腾4了网页制造poluoluo文章简介：网页制造进修教程:CSSPosition.
1.position:static
一切元素的默许定位都是：position:static，这意味着元素没有被定位，并且在文档中呈现在它应当在的地位。
一样平常来讲，不必指定position:static，除非想要掩盖之前设置的定位。
#div-1{position:static;}
2.position:relative
假如设定position:relative，就能够利用top,bottom,left和right来相对元素在文档中应当呈现的地位来挪动这个元素。【意义是元素实践上仍然占有文档中的原有地位，只是视觉上相对它在文档中的原有地位挪动了】
#div-1{position:relative;top:20px;left:-40px;}
3.position:absolute
当指定position:absolute时，元素就离开了文档【即在文档中已不占有地位了】，能够正确的依照设置的top,bottom,left和right来定位了。
#div-1a{position:absolute;top:0;right:0;width:200px;}
4.position:relative+position:absolute
假如我们给div-1设置relative定位，那末div-1内的一切元素城市绝对div-1定位。假如给div-1a设置absolute定位，就能够把div-1a挪动到div-1的右上方。
#div-1{position:relative;}#div-1a{position:absolute;top:0;right:0;width:200px;}
5.两栏相对定位
如今就能够利用绝对定位和相对定位来做一个两栏结构了。
#div-1{position:relative;}#div-1a{position:absolute;top:0;right:0;width:200px;}#div-1b{position:absolute;top:0;left:0;width:200px;}
6.两栏相对定位定高
一种计划是给元素设定流动高度。但这类计划对年夜多半计划来讲不太合适，由于一样平常我们不晓得元素中会有几文本，大概将要利用的准确的字号。
#div-1{position:relative;height:250px;}#div-1a{position:absolute;top:0;right:0;width:200px;}#div-1b{position:absolute;top:0;left:0;width:200px;}
7.浮动
关于可变高度的列来讲，相对定位就不起感化了，以下是别的一个计划。
我们能够浮动一个元素，使它挪动到右边/右侧，而且是文本围绕着它。这次要用于图象，但这里我们把它用于一个庞大的结构义务(由于这是我们独一的工具)。
#div-1a{float:left;width:200px;}
8.浮动列
假如我们把一个元素向左浮动，而且把第二个元素也向左浮动，theywillpushupagainsteachother。
#div-1a{float:left;width:150px;}#div-1b{float:left;width:150px;}
9.扫除浮动列
在浮动元素以后，我们能够扫除浮动来使其他元素准确定位。
#div-1a{float:left;width:190px;}#div-1b{float:left;width:190px;}#div-1c{clear:both;}
现在YAHOO,MSN等国际门户网站，网易，新浪等国内门户网站，和主流的WEB2.0网站，均采用DIV+CSS的框架模式，更加印证了DIV+CSS是大势所趋。 只要我们努力，无论是怎样的艰难险阻，成功依然会迎面直击。在刚开始时我觉得dreamweavermxXX很难理解。 运动)时间轴面板--拖动关键帧--单击整条--将鼠标移至中间一点--右击选择增加关键帧--移动中间关键帧的图层--勾选自动播放,循环 可以使用 CSS 检查工具进行设计。 在刚开始接触网页的第一堂课上，听说网页制作会是一门很无聊并且很难听懂的过程，而事实却印证了这样一个事实。 时间轴)窗口--时间轴--选中图层并拖图层到时间轴,将其放在指定帧上 运动)时间轴面板--拖动关键帧--单击整条--将鼠标移至中间一点--右击选择增加关键帧--移动中间关键帧的图层--勾选自动播放,循环 Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器，在编辑时能同时看到源码和设计界面，非常方便新手学习制作网页。
页:
[1]