Chạy thử Css position absolute

Chạy thử Css position absolute

Chạy thử Css position absolute

Tự code rồi chạy thử... Chạy Thử 
<!DOCTYPE html>
<html>
<head>
<title>Chạy thử Css position absolute</title>
<style>
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#kchupo{width:100%;float:left;height:300px;background:red;}
p{width:170px; height:auto; background:green; z-index:1; padding:10px; color:#fff}
span {width:100%;float:left; height:auto;margin-bottom:10px}
</style>
</head>
<body>

<h1>Chạy thử Css position absolute</h1>

<span>Css position absolute nằm trong một thẻ html position relative, phải nằm trong thẻ html position relative thì mới Css position absolute được, khi position absolute bạn có thể canh top, bottom, left, right so với thẻ HTML chứa nó, đi kèm đó là css z-index:1:</span>

<div id="kchupo" style="position: relative;">

<p style="bottom:10px; right:10px; position: absolute;">bottom:10px;right:10px;</p>

<p style="top:10px; right:10px; position: absolute;">top:10px;right:10px;</p>

<p style="top:10px; left:10px; position: absolute;">top:10px;left:10px;</p>

<p style="bottom:10px; left:10px; position: absolute;">bottom:10px;left:10px;</p>

</div>

</body>
</html>
Chạy thử Css position absolute nằm trong bài viết Thuộc tính position trong CSS