浮动练习-名人名言-高度塌陷

本文介绍了浮动元素如何影响文档流,以及如何通过clear属性清除浮动影响。同时,文章详细讨论了高度塌陷问题,解释了什么是BFC(Block Formatting Context),并列举了开启BFC的多种方式,推荐使用设置overflow为hidden来解决高度塌陷问题。
摘要由CSDN通过智能技术生成
<title>名人名言</title>
		<style>
			*{
				margin: 0;
				padding: 0;
			}
			li{
				list-style: none;
			}
			a {
			    text-decoration: none;
				
			}
			.wk{
				/* background-color: antiquewhite; */
				/* border-bottom: 1px solid ; */
				width: 1000px;
				margin: 0 auto;
			}
			.tb1{
				font-style: italic; 
				color: #707883;
			}
			.tb{
				line-height: 2;
				margin-left: 10px;
				/* border-bottom: 1px solid ; */
			}
			li{
				padding: 10px;
				border: 1px solid;
				float: left;
				color: #707883;
				margin-top:30px ;
			}
			.st{
				float: left;
				width: 1000px;
				border-top: 1px   solid #707883;
				border-bottom:1px solid #707883; ;
				/* margin-top: 84px; */
				margin:-1px -100px;
				padding:  20px 100px;
			}
			.sz-t{
				width: 600px;
				margin-top: 20px;
				border: 1px solid;
				padding: 10px;
				line-height: 1.5;
			}
			.sz-s{
				width: 600px;
				line-height: 1.5;
				margin-top: 10px;
			}
			.z1{
				font-weight: 900;
			}
			.z2{
				color: #707883;
				margin-top: 10px;
			}
			.z3{
				color: #707883;
			}
			.sz-j{
				font-size: 20px;
				border: 1px solid #707883;
				/* margin: 20px; */
				 padding: 10px;
				 width: 600px;
			}
			.sz-k{
				width: 600px;
				line-height: 1.5;
				margin-top: 10px;
			}
			.sz-k1{
				font-weight: 900;
				
			}
			.sz-k2{
				color: #707883;
				margin-top: 10px;
			}
			.db{
				width: 600px;
				border: 1px solid #707883;
				padding: 10px;
			}
			.db1{
				line-height: 2.5;
				font-style: italic;
				color: #707883;
			}
			.sy{
		
  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值