CSS-float简单练习

最新推荐文章于 2022-02-26 17:06:48 发布

木青青i

最新推荐文章于 2022-02-26 17:06:48 发布

阅读量274

点赞数 1

分类专栏： CSS 文章标签： CSS float浮动

本文链接：https://blog.csdn.net/muqingqingi/article/details/97374636

版权

CSS 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

float嵌套

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>float嵌套</title>
		<link rel="stylesheet" href="css/nav.css">
	</head>
	<body>
		<div class="container">
			<div class="logo fl">
				<img src="img/psd15897_03.jpg">
			</div>
			<div class="nav fr">
				<div class="link fl"><img src="img/psd15897_13.jpg"></div>
				<div class="link fl"><img src="img/psd15897_07.jpg"></div>
				<div class="link fl"><img src="img/psd15897_05.jpg"></div>
				<div class="link fl"><img src="img/psd15897_09.jpg"></div>
				<div class="link fl"><img src="img/psd15897_11.jpg"></div>
				<div class="clear"></div>
			</div>
			<div class="clear"></div>
		</div>
	</body>
</html>

.container{
	width: 960px;
	margin: 0 auto;
}
.fl{
	float: left;
}
.fr{
	float: right;
}
.clear{
	clear: both;
}

在这里插入图片描述

木青青i

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
CSS-float简单练习

float嵌套<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>float嵌套</title> <link rel="stylesheet" href="css/nav.css"> </head> <body...
复制链接

扫一扫