css position

kuchaguangjie · 发表于 2013-2-7 22:17:16

css position

css position & top,left,bottom,right are used for position html element.
position has four values:static,fix,relative,absolute.

here is a example to show differents between position's four values:
<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title>css position</title><style type="text/css">body {height: 2000px; width: 2000px; background-color: gray;position: relative;left: 100px;}/* position */.t1 {position: fixed; top: 200px; left: 300px;}.t2 {position: relative; top: 50px; left: 100px;}.t3 {position: absolute; top: 200px; left: 50px;}/* colors */.red {background-color: red;}.green {background-color: green;}.yellow {background-color: yellow;}.purple {background-color: purple;}.white {background-color: white;}/* size */div {width: 200px; height: 300px;}.wh120 {width:120px; height:120px;}.wh60 {width:60px; height:60px;z-index: 1;}</style></head><body><div class="t1 red"><div class="t3 white wh60"></div></div><div class="t2 green"><div class="t3 white wh60"></div></div><div class="yellow"></div><div class="t3 purple wh120"></div></body></html>

		自动登录	找回密码
密码			立即注册