Nearth===>WEB前端--第4课/html5/盒子模型+定位

最新推荐文章于 2020-02-07 15:41:50 发布

码字界陈冠希

最新推荐文章于 2020-02-07 15:41:50 发布

阅读量100

点赞数

分类专栏： WEB前端第二季

本文链接：https://blog.csdn.net/ly1716/article/details/102318245

版权

WEB前端第二季专栏收录该内容

28 篇文章 0 订阅

订阅专栏

盒子模型+定位：div的使用，postion：fixed;定位的使用；

盒子模型的嵌套:div中div;

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			*{
				margin:0px;
				padding:0px;
			}
			#div1{
				width:200px;
				height:200px;
				border:2px solid green;
			}
			#div2{
			    width:200px;
				height:200px;
				border:2px solid red;	
			}
			#div3{
			    width:200px;
				height:200px;
				border:2px solid yellow;
				position:relative;
				margin-top:40px;
			}
			#div4{
				width:50px;
				height:50px;
				border:2px solid blue;
				background-color:black;
			}
			#div5{
				width:200px;
				height:200px;
				border:2px solid orange;
	            position:fixed;
				right:50px;
				top:50px;
			}
		</style>
	</head>
	<body>
		<div id="div1">
			<div id="div4">
				div4
			</div>
		</div>
		<div id="div2">
			div2
		</div>
		<div id="div3">
			div3
		</div>
		
		<div id="div5">
			div5
		</div>
	</body>
</html>

来和小妲己一起学习鸭哒·······························

码字界陈冠希

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
Nearth===>WEB前端--第4课/html5/盒子模型+定位

盒子模型+定位：div的使用，postion：fixed;定位的使用；盒子模型的嵌套:div中div;<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> ...
复制链接

扫一扫