CSS是Cascading Style Sheets的縮寫，我們中文稱為「串聯樣式表」
CSS串聯樣式表教學『標籤元素定位效果』
  • 製作物件重疊效果必須加上position屬性：
  • position : static /* 無定位 */
  • position : relative /* 依物件左上角為基準點取相對位置 */
  • position : absolute /* 依網頁左上角為基準點取絕對位置 */
物件重疊運用範例
物件定位區塊運用
<style type="text/css">
<!--
.div{height:50px;width:150px;background:#399}
.tab{background:#c33;height:50px;width:150px}
.tabs{position:relative;top:-20px;left:30px;
background:#f60;height:50px;width:150px}
-->
</style>

<div class="div">一般DIV標籤</div>
<div class="div">一般DIV標籤</div>
<div class="tab">DIV標籤用tab樣式無定位</div>
<div class="tabs">DIV標籤用tabs樣式加了定位</div>

一般DIV標籤

一般DIV標籤

DIV標籤用tab樣式無定位
DIV標籤用tabs樣式加了定位
物件定位表格運用
<table width="300px" height="50px" border="1" style="position:relative;top:20px;left:20px">
<tr><td bgcolor="#0099cc">表格一 加了定位 </td></tr>
</table>
<table width="300px" height="50px" border="1"><tr>
<td bgcolor="#66ccff">表格二 沒有定位</td>
</tr></table>
表格一 加了定位 position:relative;top:20px;left:20px
表格二 沒有定位


XHTML1.0 | CSS | Copyright © 2001-2008 by OECSPACE