代码示范：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>练习</title>

</head>

<body>

    <div id="main">

            <div id="aside">

                  hello

            </div>

            <div id="content">

                   world

            </div>

        </div>

</body>

<script>

</script>

<style>

    #main  {

        display:flex;

    }

    #aside {

       width:300px;

       height:800px;

       background-color:aquamarine;

    }

    #content {

        height:800px;

        background-color: brown;

        flex:1;

    }

    body {

        margin:0;

    }

</style>

</html>

　　

效果：

flex：1将页面铺满的更多相关文章

  1. PPT如何一页多张打印且铺满整个页面

    最近由于工作需要,有些ppt材料想打印出来学习,但是ppt页数较多,ppt单页打印有些浪费纸张,而且也不能拿到外面打印店去打印,所以只能自己动手设置一页多张打印,并且最后双面打印,这样就做够节省纸张了 ...

  2. 如何使一个div能够铺满整个页面？ && 模态框的制作 && outerHTML

    说明: 使用 ele.outerHTML = '' 这样的方法可以很容易的清除一个元素. 当然也可以使用parent.removeChild() ,但是相较而言,还是使用 outerHTML = '' ...

  3. flex 均分铺满

    <view>充值金额</view> <view class="weui-flex"> <repeat for="{{amount ...

  4. iOS- 解决iOS10 App启动时放大铺满App Icon的问题

    0.前言 iOS10 App启动时放大铺满App图标 iPad Application shows app icon as launch screen in iOS 10 如图,点击APP后APP图标 ...

  5. video作为背景全屏铺满问题

    项目中我打算使用一个MP4视频作为登录界面背景,首先在静态页面都没法显示出来,后来发现需要将视频的编码格式转换为H264的格式方能正常显示(使用格式工厂转换即可): 后又发现视频没办法铺满全屏,在不同 ...

  6. Unity2D 背景图铺满与Camera.Size的计算公式

    在unity制作2D游戏的教程,背景图sprite铺满显示时Camaer的Size调到多少合适,作个笔记. 资源参数 background.png 2048x640,Sprite的像素单位:100 调 ...

  7. ExtJS-Viewport背景图片铺满浏览器视图并自动伸缩

    var viewport = Ext.create('Ext.container.Viewport', { style : 'background-image:url(login_bj.jpg);ba ...

  8. js控制图片自动缩放，实现铺满盒子，不变形，完全局中

    此js一般用于控制图片铺满盒子,但是比例不变,并且绝对局中原理:判断图片的高宽与盒子高宽的大小的关系,然后通过比例来控制图片的缩放及定位<!DOCTYPE html PUBLIC "- ...

  9. 设置ImageView显示的图片铺满全屏

    转自:http://m.blog.csdn.net/blog/wjwj1203/32334459   为适应不同屏幕的手机,ImageView显示的图片可能不铺满屏幕,如果定高的话,两边可能会出现空白 ...

随机推荐

  1. 什么是CI/CD？

    CI, CD AND CD 当我们在谈论现代的软件编译和发布流程的时候,经常会听到CI 和CD这样的缩写短语.CI很容易理解,就是持续集成.但是CD既可以指代码持续交付,也可理解为代码持续部署.CI和 ...

  2. 如何在vue-cli 中适当的配置，来满足自己项目需求 ？

    1. 改变index.js 中端口号host host:'localhost' 改为 host: '0.0.0.0' 然后换成自己的ip 访问: 2. 在vue 中运行cnpm run start 中 ...

  3. 【转】移动前端开发之viewport的深入理解

    原文链接:https://blog.csdn.net/u012402190/article/details/70172371 笔记 (20180919,目前暂且只看一部分)

  4. java oop第11章_反射、BaseDao的进一步改造

      引言:从Java5开始,Java中引用了一个新的概念反射,当程序运行时,能动态感知到程序中拥有的所以信息,这个获取信息的过程是采用反射机制来完成. 一.       Class类: Class类用 ...

  5. ARM TK1 安装ROS- indigo

    之前安装不成功是因为校园网无法访问源的问题. Ubuntu ARM install of ROS Indigo There are currently builds of ROS for Ubuntu ...

  6. MySQL 开始

    安装,配置环境变量啥的,网上一抓一大堆,不说了.就说我再实际操作中遇到的问题. 1   添加自增列 点击apply,直接提示一个错误....百思不得其解..上图... 添加不了自增列....好恐怖.. ...

  7. Java内存管理简述

    转自:http://www.codeceo.com/article/java-memory-area.html 一.概述 Java虚拟机在执行Java程序的过程中会把它所管理的内存划分为若干不同的数据 ...

  8. could not load the tomcat server configuration ...

    参考文档:  https://blog.csdn.net/u013381651/article/details/51567758 问题解决. 原因是你把项目里的tomcat的server项目也关闭了, ...

  9. C:\Windows\System32\drivers\etc中的hosts文件

    这个文件是根据TCP/IP for Windows 的标准来工作的,它的作用是包含IP地址和Host name(主机名)的映射关系,是一个映射IP地址和Host name(主机名)的规定,规定要求每段 ...

  10. 暑假集训test-8-30

    这套题有毒,T1标程挂了,T2题面完全莫名其妙,T3没有告诉取模害我打了好久高精... A题. 统计每个数后面比它小的数的个数记作f把,操作一个数就是把它后面所有比它小的数和它的f清0,然后若是它到它 ...