html - Div 不会触及屏幕的边缘-6ren

html - Div 不会触及屏幕的边缘

转载作者：太空宇宙更新时间：2023-11-03 22:26:19

25

4

我试图让这个 div“maindiv”触摸屏幕的两侧，或者拉伸(stretch)以触摸它们。我已经查看了操作方法，但没有得到任何具体信息。

我只是想将它拉伸(stretch)到屏幕的两侧，而不在底部创建滚动条!

    body {
        background-image: url("https://i.gyazo.com/b31293b75dbdff3868a22fc90f9d465c.jpg");
	    background-attachment: fixed;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .header {
        min-height: 500px; 
    }

    .header p {
        text-align: center;
        position: relative;
        top: 250px;
        font-family: Montserrat;
        color: #f5dabf;
        font-size: 40px;
        text-transform: uppercase;
        font-weight: 100;
        letter-spacing: 5px;
        word-spacing: 20px;
        border-bottom: #f5dabf solid 1px;
        width: 25%;
        margin: auto;
        padding-bottom: 10px;
    }


    .maindiv {
       background-color: #ffffffe8;
       min-height: 250px;
       max-width: 100%;
       margin: auto;
	   margin-bottom: 10%;
      }

    .maindiv p {
      font-family: Verdana, sans-serif;
      padding: 30px;
   
    }

    <html>
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    </head>
    <body>

    <div class="header"> <p> Infinite Design </p></div>

    <div class="maindiv">
    <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sed venenatis enim, ac auctor massa. Praesent eget libero sapien. Nulla facilisi. Proin id nunc diam. Aliquam efficitur consequat mauris. Donec vitae risus mollis, lobortis erat vitae, ultrices leo. Praesent rutrum mi non tellus malesuada, non mollis lacus blandit. Nullam ac tincidunt lacus. Integer maximus massa scelerisque placerat lacinia. Curabitur fermentum condimentum euismod. Nunc eu condimentum nunc. In vel viverra dolor. Cras vel ex molestie, gravida est et, ullamcorper sapien. Cras sapien leo, suscipit non tortor eu, hendrerit efficitur massa. Morbi ultricies hendrerit imperdiet.
    <br><br>
    Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla porttitor, elit quis eleifend dignissim, massa nunc dictum lorem, quis volutpat ex metus non urna. Morbi in vestibulum sapien. Phasellus massa dui, convallis eget consectetur non, aliquam sed ligula. Aliquam nec mauris tempor, laoreet lectus ut, gravida tortor. Aenean tempus hendrerit consequat. Nullam feugiat diam ut tortor congue, non consequat nulla consectetur. Integer eu consequat magna. Nunc placerat lacinia accumsan. Aliquam erat volutpat.
    <br><br>
    </p>
    </div>
    </body>
    </html>

感谢您的帮助!

最佳答案

您可以添加 margin:0;到 body 标签。

默认情况下，html 将为您的 <body> 添加边距标签。

关于html - Div 不会触及屏幕的边缘，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50959981/

25

4

0

文章推荐： c# - 覆盖 ASP.net 中的母版页功能

文章推荐： node.js - 在 Node.js 中同步使用另一个文件中的返回值

文章推荐： javascript - Passport 回调500服务器错误

文章推荐： css - 如何通过 Angular 绑定(bind)值设置背景颜色

检查字符串中的数字是否对称(边缘)
我有一串数字。我需要检查边缘上的数字是否对称，这意味着它们以 2 为模时具有相同的余数。我已经编写了一个有效的代码，但我对此感到不安，在一些失败之后我想出了这个代码: int PaliPair(ch
python - 如何使用python删除图像中人物周围的白色边框/边缘？
我要删除黑色蒙版和人体图像之间的白色边框图像输入示例: 厚度为1的图像输出: 厚度为2的图像输出: 我尝试了一些在这里找到的具有模糊和阈值的游戏我还使用此代码查找和绘制轮廓 thickne
javascript - 边缘、悬停和单击
这应该是一个在用户悬停时打开的飞出菜单。这在 Chrome 中工作得很好，我已经尝试了多种方法(使用 CSS :hover，(mousenter)和(mouseleave ) 问题是 - 使用 Ed
apache - 边缘 Chrome 不会显示基本身份验证弹出窗口？
我有一个 Apache 服务器 v2.4.43 为我的网站提供服务，我使用一个简单的 .htpasswd，我使用指令“AuthUserFile ”在 .htaccess 中调用它来进行身份验证。现在
css - 创建剪辑路径波 css 边缘
如何仅使用剪辑路径创建波浪边缘？波浪应该是这样的图像: 最佳答案您应该通过波函数及其频率生成此剪辑路径。我用过 cos()在 PHP 中。您可以找到如下链接: https://repl.it/@
graphviz - 如何添加“不相关的”边缘
我有这张图： digraph G { 1 [label="car"]; 2 [label="x"]; 3 [label="car"]; 4 [label="y"]; 5 [label="cdr"];
graphviz - 用点强制正交(垂直或水平)边缘
我想强制点仅显示节点之间的垂直或水平边缘。我在帖子 Family tree layout with Dot/GraphViz 中发现了类似的请求，但我不处理树，所以我希望有一个解决方案，无需插入额外
python - 如何对齐重叠图中的直方图 bin 边缘
我已经设法让两个直方图重叠，但如果你仔细观察，条形开始倾斜并且没有完全重叠。我已经调整了线宽和宽度，并没有改善。我的目标是让所有的条形排列在彼此的顶部，黑边没有歪斜。有什么办法解决这个问题这是
python - 如何对齐重叠图中的直方图 bin 边缘
我已经设法让两个直方图重叠，但如果你仔细观察，条形开始倾斜并且没有完全重叠。我已经调整了线宽和宽度，并没有改善。我的目标是让所有的条形排列在彼此的顶部，黑边没有歪斜。有什么办法解决这个问题这是
latex 填充物/边缘 hell
我一直在与 latex table 搏斗太久了。我需要一个具有居中标题的表格，以及包含可能环绕的文本的正文单元格。由于环绕要求，我使用 p{xxx} 而不是 l 来指定单元格宽度。这导致的问题是单元格
java - 平滑 BufferImage 边缘
有没有办法平滑转换(平移和旋转)的 BufferedImage 的锯齿状边缘？测试图像的放大 View : (请注意，这不是将要使用的实际 BufferedImage，仅用于此处演示)。已使用双线
css - 子元素不继承父元素的 flex 边缘？
我在 my page 有一个旋转木马.我的父元素和子元素的边缘都是 flex 的，但是当您按“下一个”或“上一个”并滑动旋转木马时，子元素在移动时不会保持 flex 。我怎样才能避免这种情况？ .ho
html - 删除空白和粘性 div 边缘？
我在 .boxwrap 和 .lsmlbox + .rsmlbox 之间的嵌套 div 中添加了不必要的空格，这使得无法将 .smlbox + .rsmlbox 与 .box 对齐我相信这是一个比预期
swift - 绘制没有对角线的 SCNBox 边缘？
我正在使用 Apple 的 ARKit 制作 AR 应用程序，我想制作盒子的线框轮廓。代码中描述并显示在图片中的那个在盒子的每个面上绘制斜边。它还隐藏了盒子另一侧的角。 Scene Kit 中有没有办
c++ - opencv:如何填充区域外的区域/边缘
下图仅包含阈值处理后的黑色和白色像素。我在此图像的顶部绘制了一个灰色的旋转矩形。现在我想计算这个旋转矩形内的黑色像素数，但不包括白色矩形矩形外的黑色像素(即白色矩形内的像素数)。做到这一点的最佳方法
html - 边缘 CSS 属性
你们如何处理边际 CSS？我所说的边缘是指需要斜体或粗体的单个单词或短语。只用声明一个“大胆”的类似乎很愚蠢 Bold { font-weight: bold; } 或者斜体，要么! Italic
html - 如何去除网页底部的空白？ (IE/边缘)
好的。我知道有几十个类似的线程。我几乎检查了每一个，但找不到可行的解决方案。我试过负边距、最小高度、最大高度、绝对页脚、正文背景颜色，甚至将溢出:隐藏到页面中的所有主要容器。然后将 clearfix
html - 如何使所有跨浏览器兼容倾斜的 div 边缘？
我网站的一部分使用代码使用倾斜边缘: -webkit-clip-path: 多边形(0% 0%, 100% 0%, 81% 100%, 0% 100%) 这在 Chrome 中运行良好，但不适用于任何
html - IE(边缘)和谷歌浏览器中的图像对齐方式发生了变化
我一直在创建这个网站，并且进展顺利。然后我试着给它添加一个模态，但一切都有点走下坡路。问题是在添加模式后，Chrome 中的图像对齐方式发生了变化。它在 Edge 中运行良好。现在我知道这可能是因为
image - 图像上的刻度线是否有可能以像素的“边缘”为中心？
如果我在 Matlab 中使用 image() 命令制作一个 4 x 4 像素的图像，它会将刻度线居中放置在像素的中间。我希望刻度线以像素的左下角为中心。有什么方法可以做到这一点吗？最佳答案您可以

首页

博学

6Ren·AI

商城

html - Div 不会触及屏幕的边缘