008文字与小盒子或者图片对齐

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>文字对齐</title>
	<style>
		div{
			width: 400px;
			height: 100px;
			border: 1px solid red;
			line-height: 100px;
		}
		span{
			display: inline-block;
			width: 20px;
			height: 20px;
			background-color: pink;
			
			vertical-align:middle;     
			margin-top: -5px;

			/*vertical-align:middle;     
			margin-top: -5px;                让文字与盒子对齐,margin-top 可调*/
		}
	</style>
</head>
<body>
	<div>
		<span></span>我是文字
	</div>
</body>
</html>

猜你喜欢

转载自blog.csdn.net/weixin_40422393/article/details/88937521
今日推荐