您当前位置: 南顺网络>> 官方资讯>> 建站知识

rem布局解析

1、使用CSS3媒体查询的方法

@media screen and (max-width: 400px) {

body {

background: red;

}

}

 2、 直接使用百分比

#percent{

width: 100%;

display: flex;

flex-direction: row;

justify-content: center;

align-items: center;

}

#percent .item{

flex: 1;

}

#percent .item img{

display: block;

width: 100%;

height: auto;

}

 3、 固定宽度

#container{

width: 680px;

background: yellow;

margin: 0 auto;

}

h1{

text-align: center;

}

4、使用viewport

这得要在网页的head标签上面设置meta,比如:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">


编辑:--彭新洪

填写您的服务需求,项目经理一对一为您服务!