css 根据不同屏幕设置间距_css怎么设置根据不同分辨率加载不同css？

CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。

css设置根据不同分辨率加载不同css的方法：

1、用媒体查询加载对应css：

会随着你的拖动窗口大小而执行//其中 media 是媒体查询的范围，当最大宽度是1200，这里就是手机平板一下的尺寸 加载手机css ，反之电脑css

href="../css/m_wuqinglan.css" media="screen and(max-width:1200px)"/>

href="../css/pc_wuqinglan.css" media="screen and (min-width:1201px)"/>

2、直接媒体查询然后写样式@media only screen and (max-width: 1024px) {

.div1{

width:50%;

}

.div2{

width:50%;

}

.div3 {

width:50%;

}

}

@media only screen and (min-width: 1024px) {

.div1{

width:100%;

}

.div2{

width:100%;

}

.div3 {

width:100%;

}

}

使用 @media 查询，你可以针对不同的媒体类型定义不同的样式。

@media 可以针对不同的屏幕尺寸设置不同的样式，特别是如果你需要设置设计响应式的页面，@media 是非常有用的。

当你重置浏览器大小的过程中，页面也会根据浏览器的宽度和高度重新渲染页面。