zoukankan      html  css  js  c++  java
  • 设置div全屏

    如何设置div的高度是body的高度的100%

    如果直接设置div的高度为100%,那么是没有效果的,如下图所示:

    复制代码
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <style>
            </style>
        </head>
        <body>
            <div style=" 100%;height: 100%; background: red;">111<div>
        </body>
    </html>
    复制代码

    效果如下图所示,是没有效果的

    原因是body的高度是默认为auto的,所以只要设置body的高度为100%,就能设置div全屏了

    复制代码
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <style>
                html,body{
                    height: 100%;
                    padding: 0px;
                    margin: 0px;
                }
            </style>
        </head>
        <body>
            <div style=" 100%;height: 100%; background: red;">111<div>
        </body>
    </html>
    复制代码

    注意:一定要设置html和body,不能只设置body,否则也是没效果的。

    设置完成后就有效果了

    参考:https://zhidao.baidu.com/question/196792199.html 

  • 相关阅读:
    _1_html_框架
    _0_web_基础
    _0_工具
    虚拟机安装与使用
    NumPy数据类型
    NumPy Ndarray对象
    机器学习之K-近邻(KNN)算法
    vue项目如何打包扔向服务器
    Eslint 规则说明
    Python ssh 远程执行shell命令
  • 原文地址:https://www.cnblogs.com/StarZhai/p/13954901.html
Copyright © 2011-2022 走看看