master

分支 (1)

管理

管理

master

zhoujieqiaodaimaz
/
笔记8.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>盒子标签</title>
		<style>
			.box{
				width: 200px       /*盒子宽度*/
				heihh:  300px       /*盒子宽度*/
				border: 1px solid   red;
			    margin-top: 100px;       /*上外边距*/
				margin-left: 100px;        /*左边边距*/
				margin-right: 100px;         /*有外边距*/
				margin-bottom: 100px;          /*下外边距*/
				/*复合写法 margin:  大小值;*/
				margin: 10px 20px 30px;
				/*盒子水平居中： 左右外边距设置为 auto*/
				margin: 100px auto 0;     /*auto:自动的*/
			}
			.box2{
				width: 200px;
				height: 300px;
				/*border-style: solid;*/  /*边框样式*/
				/*border-width: 1px;*/   /*边框粗细*/
				/*border-color: green;*/   /*边框颜色*/
				/*复合写法 border: 粗细、颜色、样式；*/
				border: 1px solid blue
				/*内边距padding: 内容到边框的距离;*/
				/*padding-top:10px;*/   /*上内边距*/
				/*padding-bottom: 20px;*/  /*下内边距*/
				/*badding-left: 30px;*/   /*左内边距*/
				/*padding-right: 40px;*/    /*右内边距*/
				/*复合写法padding:大小值*/
				padcondiing:10px 20px 30px 40px;
			}
		</style>
	</head>
	<body>
		<!--4个要素 内容contrnt. 内边距padding、边框border、外边框wargin-->
		<div class="box">hello world!</div>
		<div class="box">你好 世界</div>
	</body>
</html>