前へ 目次 次へ

position, top, right, bottom, left

style26.css 
.box1{
	position: absolute;
	top: 50px;
	right: 100px;
	background: red;
	width: 400px;
	height: 50px;
}
.box2{
	position: relative;
	top: 0px;
	right: -50px;
	background: green;
	width: 400px;
	height: 50px;
}
css26s1.html 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<title>border style</title>
<meta http-equiv="content-type" content="text/html;charset=Shift_JIS">
<link rel="stylesheet" href="style26.css" type="text/css">
<p class="box1">
position; absolute;
top: 50px;
right: 100px;
</p>
<p class="box2">
position; relative;
top: 0px;
right: -50px;
</p>
</body>
</html>

クリックすると表示結果をみることができます。

解説

position：

2003//()

トップページへ

広告 花 万馬券 無料レンタルサーバー ブログ blog