javascript - 适配不同屏幕的高度
迷茫
迷茫 2017-04-10 14:53:10
[JavaScript讨论组]

项目需求 网页高度必须一屏, 适配不同屏幕的高度,各个模块的之间的间距随着各种屏幕高度的大小变化而变化,求 相关案例的可以参考一下,或者实现思路。

迷茫
迷茫

业精于勤,荒于嬉;行成于思,毁于随。

全部回复(4)
怪我咯

宽度高度不要写死,用百分比来实现,自适应思想

巴扎黑

用媒体查询为不同屏幕高度设置不同的css。

迷茫
<!DOCTYPE html>
<title>hei</title>

<style>
html {
    height: 100%;
}

body {
    margin: 0;
    height: 100%;
    position: relative;
}

section {
    height: 33.333%;
    background: #ddd;
}

section::after {
    content: '\200b';
    display: block;
    height: 5%;
    background: #fff;
}

section:first-child::after {
    display: none;
}
</style>

<section></section>
<section></section>
<section></section>
阿神

你可以参考下semantic的关于responsive的间隔处理方式

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号