CSS:图片自适应效果

效果:图片自动适应浏览器的大小,比较适合背景

这个很简单,但是本人一直好忘,就记下了。

<!doctype html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<meta name="Generator" content="EditPlus®">
		<meta name="Author" content="">
		<meta name="Keywords" content="">
		<meta name="Description" content="">
		<title>图片自适应</title>
		<style type="text/css">
			.logo {
				background-image: url('img/logo.jpg');
				background-size: 100%;
				width: 100%;
				padding-top: 29.8%;
				height: 0;
				text-indent: -9999px;
			}
		</style>
	</head>

	<body>
		<h1 class="logo">超实用的CSS代码段</h1> 改变窗口大小试试
	</body>

</html>

猜你喜欢

转载自blog.csdn.net/qq_42192693/article/details/88082603
今日推荐