qq_40619811 2022-06-06 21:08 采纳率: 89.8%
浏览 27
已结题

设置div的高度的问题


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>Title</title>
    <style type="text/css">
        #msg{
            width: 100%;
        }
        #msg2{
            height: 120px;
            width: 100%;
        }
    </style>
</head>
<body>
<script type="text/javascript"
    >
    var screen=window.screen.height;
</script>
<div id="msg" style="background-color: red;"></div>
<div id="msg2" style="background-color: green;"></div>
</body>
</html>

你好,像这个html代码,我要求id为msg的div,它的高度是屏幕的高度(就是js代码里面的screen变量)与名为msg2的div的高度相加之和。比如屏幕高度(就是js代码的screen变量)是1024的,那么msg的高度就是1144。该怎么做?
要求:一定要用到js代码的screen变量和msg2的高度
我尝试过

        #msg{
            width: 100%+120px;
        }
       

不行。
该怎么办呢?

  • 写回答

3条回答 默认 最新

  • 搬砖的小编 2022-06-07 11:37
    关注

    css直接搞定

    body{
    height:100vh
    }
    
    #msg{
        height: calc(100% + 120px);
    }
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
  • 王鹏飞的解忧屋 2022-06-06 21:16
    关注
    
    <script>
         var screen=window.screen.height;
         var msg2 = document.getElementById("msg2");
         var msg = document.getElementById("msg");
         msg.style.height = screen + ms2.style.height + 'px';
      </script>
    
    评论
  • 你好!机器人 2022-06-06 21:21
    关注
    
     
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
            "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
        <title>Title</title>
        <style type="text/css">
            #msg{
                width: 100%;
            }
            #msg2{
                height: 120px;
                width: 100%;
            }
        </style>
    </head>
    <body>
    <div id="msg" style="background-color: red;"></div>
    <div id="msg2" style="background-color: green;"></div>
    
    <script type="text/javascript">
        var screen=window.screen.height;
         var msg2 = document.getElementById("msg2");
         var msg = document.getElementById("msg");
         msg.style.height = screen + msg2.offsetHeight + 'px'
    </script>
    </body>
    </html>
    
    评论
查看更多回答(2条)

报告相同问题?

问题事件

  • 系统已结题 6月15日
  • 已采纳回答 6月7日
  • 创建了问题 6月6日

悬赏问题

  • ¥15 eclipse无法正常运行
  • ¥15 定义了函数,但是无法根据函数定义触发器
  • ¥20 5变量卡诺图化简得出与非门电路图
  • ¥20 位置依赖的碱基序列独热编码
  • ¥15 Python爬取交通拥堵指数数据
  • ¥15 使用vba抓取重定向网页问题
  • ¥20 付费需求测试程序(细谈)。
  • ¥15 为什么这段c++代码会报这么多语法错误?
  • ¥20 如何利用C语言实现用最小二乘法选配两个经验公式
  • ¥50 vue-codemirror如何对指定行 指定位置的 字符进行背景颜色或者字体颜色的修改?