📄 10-27.html

📁 一些css样式表的例子供大家学习和参考。

💻 HTML

字号:

<html>
<head>
<title>position属性</title>
<style type="text/css">
<!--
body{
	margin:10px;
	font-family:Arial;
	font-size:13px;
}
#father{
	background-color:#a0c8ff;
	border:1px dashed #000000;
	width:100%; height:100%;
	padding:5px;
}
#block1{
	background-color:#fff0ac;
	border:1px dashed #000000;
	padding:10px;
	position:relative;		/* relative相对定位 */
	left:15px;				/* 子块1的左边框距离它原来的位置15px */
	top:30px;				/* 子块1的左边框距离它原来的位置30px */
}
#block2{
	background-color:#ffc24c;
	border:1px dashed #000000;
	padding:10px;
	position:relative;		/* relative相对定位 */
	left:10px;				/* 子块2的左边框距离它原来的位置10px */
	top:20px;				/* 子块2的上边框距离它原来的位置15px */
}
-->
</style>
   </head>
<body>
	<div id="father">
		<div id="block1">relative</div>
		<div id="block2">block2</div>
	</div>
</body>
</html>

⌨️ 快捷键说明

复制代码 Ctrl + C

搜索代码 Ctrl + F

全屏模式 F11

切换主题 Ctrl + Shift + D

显示快捷键 ?

增大字号 Ctrl + =

减小字号 Ctrl + -