html5屏幕自适应

html5屏幕自适应

下边是我简单的例子:

首先看大于1000px样子:

image.png

然后在小于1000px样子

image.png

下边代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>hmtl5自适应</title>
<style>

/*当大于1000px时候执行的代码*/
.ta_c{
	width: 100%;
	background: red;
	margin: 0 auto;
	height: 600px;
}
/*当小于于1000px时候执行的代码*/
@media screen and (max-width:1000px){
	.ta_c{
		width: 50%;
		background: red;
		margin: 0 auto;
		height: 600px;
	}
}

</style>
</head>
<body>

<div class="ta_c">

</div>

</body>
</html>

html5屏幕自适应 上边是我自己的理解,如有不对 尽情喷我~~~

喜欢(1)

评论 抢沙发

表情