[推荐]CSS教程—元素的定位
4. position:relative + position:absolute|绝对定位+相对定位
如果给父元素(div-1)定义为position:relative;子元素(div-1a)定义为position:absolute，那么子元素(div-1a)的位置将相对于父元素(div-1)，而不是整个页面。
让div-1a定位于div-1的右上角：
example:
| 以下是引用片段： <div id="div-1"> <div id="div-1a"> this is div-1a element. </div> this is div-1 element. </div> #div-1 { position:relative; } #div-1a { position:absolute; top:0; right:0; width:200px; } |
| 以下是引用片段： <div id="div-1"> <div id="div-1a">this is the column-one</div> <div id="div-1b">this is the column-two</div> </div> #div-1 { position:relative;/*父元素相对定位*/ } #div-1a { position:absolute;/*子元素绝对定位*/ top:0; right:0; width:200px; } #div-1b { position:absolute;/*子元素绝对定位*/ top:0; left:0; width:200px; } |
| 以下是引用片段： #div-1a { float:left; width:200px; } |
| 以下是引用片段： #div-1a { float:left; width:150px; } #div-1b { float:left; width:150px; } |
| 以下是引用片段： <div id="div-1a">this is div-1a</div> <div id="div-1b">this is div-1b</div> <div id="div-1c">this is div-1c</div> #div-1a { float:left; width:190px; } #div-1b { float:left; width:190px; } #div-1c { clear:both; } |
| 如何针对Yahoo搜索进行网站优化 | 04-04 | |
| 搜索引擎不收录网站页面的15个原 | 04-04 | |
| 网站推广29大法 | 04-04 | |
| 搜索引擎优化培训教程 | 04-02 | |
| 彻底弄懂CSS盒子模式(DIV布局快速 | 03-19 | |
| Google优化圣经 | 03-19 | |
| 新网站流量快速提高实战 | 02-07 | |
| 2007年，个人站长将何去何从？ | 02-03 | |
| 个人网站到底应该做什么样的广告 | 01-29 | |
| 王通：网站的首页最应该放什么？ | 01-25 | |
| 百度与站长：关于网站收录删除和 | 01-04 | |
| 搜索引擎对页面各元素的权重比例 | 12-26 | |
您现在的位置：