网站开发技术

admin

管理员

css中的响应式布局原理

具体的原理是通过不同的原理，加载不同的样式。

主要是媒体查询， 比如一个示例

<style>
	@media screen and (min-width: 1000px) {
		body {
			background-color: red;
		}
	}

	@media screen and (max-width: 1000px) {
		body {
			background-color: green;
		}
	}	
</style>

这个就表示如果 屏幕的宽度比最小的宽度1000px大就把背景显示为红色

如果屏幕的宽度比最大的宽度1000px小，就显示成绿色。 

---

ipbbs.net