padding对背景图片位置的影响

xyy_html

于 2020-04-29 15:27:55 发布

阅读量1.8k

点赞数

CC 4.0 BY-SA版权

文章标签： html css

本文链接：https://blog.youkuaiyun.com/xyy_html/article/details/105840923

本文探讨了在CSS样式中，设置元素的padding如何影响背景图片的位置。通过实例解析，展示了不同padding值下，背景图片在元素内部的显示效果变化，帮助开发者更好地控制元素内容与背景图片的布局。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
		.box {
			width: 800px;
			height: 800px;
			background-image: url(01.jpg);
			background-repeat: no-repeat;
			background-color: #ccc;
			font: 700 50px "Microsoft Yahei";
			/*text-align: right;*/
			color: #eee;
			margin: 20px auto;
			padding: 30px;
		}
	</style>

</head>
<body>
	<div class="box">
		新垣结衣
	</div>
</body>
</html>