HTML DIV充满整个屏幕

<!DOCTYPE html>
<html>
    <head>
        <title>A Little Game!</title>
        <meta charset="utf-8" />
        <style>
            html,body{
                height:100%;
                width: 100%;
                margin: 0;
                padding: 0;
            }
            #playground{
                background-color: blue;
                width: 100%;
                height: 100%;
                margin: 0;
                padding: 0;
            }
        </style>
    </head>
    <body>
        <div id="playground">fdsa</div>
    </body>
</html>

时间： 2024-10-05 05:58:29

HTML DIV充满整个屏幕的相关文章

利用onresize使得div可以随着屏幕大小而自适应的代码

原文:http://www.jb51.net/article/21831.htm 当我们让div居中时候,一般有两种方法,一种是固定左右宽度,也就是使用像素绝对定位:另一种是用百分比来相对定位,在这种两种方式下,绝对定位是不能让div随着屏幕而自适应的,而用百分比就可以,但是,是用百分比就会有一个新的问题,如果我们的页面中有这么一句 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:

一个div自动充满当前屏幕的解决方法

方法一(先写一种呵呵呵) html <body> <div class="box1"> </div> </body> css *{ margin:0; padding:0; } body,html{ height:100%; padding:0; margin:0; text-align: center; font-size:20px; font-family: Cambria, Cochin, Georgia, Times, 'Time

android 如何让自定义dialog的宽度充满整个屏幕?

============问题描述============ android 如何让自定义dialog的宽度跟屏幕的宽度一样.求大神们指教下.. ============解决方案1============ 在你dialog.show();后面加上 WindowManager windowManager = getWindowManager(); Display display = windowManager.getDefaultDisplay(); WindowManager.LayoutParam

div宽度随屏幕大小变化

题目: 一个页面上两个div左右铺满整个浏览器, 要保证左边的div一直为100px,右边的div跟随浏览器大小变化, 比如浏览器为500,右边div为400,浏览器为900,右边div为800. 方案一:使用flex布局 <div class="box"> <div class="left"></div> <div class="right"></div> </div> .

控制DIV占满屏幕

网上找了很多帖子,希望是CSS控制的,但是在bootstrap环境下, 控制方式上有点问题.达不到想要的效果. 项目中需要实现的效果: DIV区域占满当前窗口的高度.且在ctrl+鼠标滚轮调整窗口大小的时候,依然占满窗口高度.且,不论DIV区域内容到底多少,都是占满窗口高度,内容多的时候,显示垂直滚动条.左右窗口显示的是一个信息树,ztree实现, 右边窗口将用datatable实现表格.这里重点是DIV高度占满窗口的高度... 研究了很多方式,最终还是选择了通过js的方式控制DIV占满当前窗口

【css面试题】三个DIV要求水平对齐，左右两个DIV宽度固定为100px，中间那个DIV充满剩余的宽度（至少2种方法）

这是我在一家公司面试时遇到的问题,当时没有答上来!! 所以看到的小伙伴一定要注意了!! 变化浏览器宽度可看到效果: 左右中然后我们来看看代码: 第一种方法:(浮动) <style type="text/css"> .left,.right,.center{ border:1px solid; height:100px; text-align: center; line-height:100px; font-size:50px; } .left{ float:left;

实现让一个DIV在电脑屏幕的正中间显示！

<!DOCTYPE html><html><head><meta charset="utf-8"><title></title><style type="text/css">*{margin: 0px;padding: 0px;}body{background: black;}.main{width: 1000px;height: 500px;position: absolute;b

css背景图充满整个屏幕

.login{ background-size:cover; position:fixed; top:0; left:0; width:100%; height:100%; background: url("../../assets/login.png")no-repeat center center; } <div class="login"></div> 原文地址:https://www.cnblogs.com/IT123/p/10882

如何让一张背景图充满整个屏幕

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta content="width=device-width, height=device-height,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport"