HTML背景相关

最新推荐文章于 2021-10-09 14:46:51 发布

阿黄Ahuang

最新推荐文章于 2021-10-09 14:46:51 发布

阅读量217

点赞数

本文链接：https://blog.csdn.net/FZUMRWANG/article/details/82831308

版权

背景

<!DOCTYPE html>
<html>
	<head>
		<meta charset="{CHARSET}">
		<title></title>
	</head>
	<body>
		<!--
			background	背景
			background-color	背景色
			background-image	背景图片
			background-repeat	表示背景图片是否重复
			background-position	背景图片的位置
			background-attachment	背景图片是否滚动
        -->
	</body>
</html>

背景色

<!DOCTYPE html>
<html>
	<head>
		<meta charset="{CHARSET}">
		<title></title>
	</head>
	<body>
		<!--
			background	背景
			background-color	背景色
			background-image	背景图片
			background-repeat	表示背景图片是否重复
			background-position	背景图片的位置
			background-attachment	背景图片是否滚动
        -->
	</body>
</html>

背景图片

<!DOCTYPE html>
<html>
	<head>
		<meta charset="{CHARSET}">
		<title></title>
	</head>
	<body>
		<!--
			background	背景
			background-color	背景色
			background-image	背景图片
			background-repeat	表示背景图片是否重复
			background-position	背景图片的位置
			background-attachment	背景图片是否滚动
        -->
	</body>
</html>

背景复合样式

<!DOCTYPE html>
<html>
	<head>
		<meta charset="{CHARSET}">
		<title></title>
	</head>
	<body>
		<!--
			background	背景
			background-color	背景色
			background-image	背景图片
			background-repeat	表示背景图片是否重复
			background-position	背景图片的位置
			background-attachment	背景图片是否滚动
        -->
	</body>
</html>

背景是否滚动

<!DOCTYPE html>
<html>
	<head>
		<meta charset="{CHARSET}">
		<title></title>
		<style>
			div{
			width:300px;
			height:1000px;
			border:10px solid red;
			background-image:rul(images/img.jpg);
			background-repeat: no-repeat;
			background-attachment:scroll;
		}
		</style>
		
	</head>
	<body>
		<!--
			backgrounf-attachment	背景图片是否滚动
						   scroll	背景图片跟随滚动条滚动
						   fixed	背景图片不会跟随滚动条而滚动
		-->
		<div></div>
	</body>
</html>