我被要求尝试修改页面以在其他地方使用。
基本上,除了一个我无法解决的谜团之外,我所做的一切。
我基于的页面是https://wombatservers.com.au/theburrow
请注意顶部描绘 Minecraft 世界的大图像。好吧,基本上我不能让它填满屏幕的整个宽度(它需要在另一个项目中是特定的大小)。但是我一辈子都找不到控制的地方,底部的蓝色页脚也是如此。
因此,如果有人可以帮助我追踪这些元素的宽度被称为哪一行,那就太好了。
(我希望这是我忽略的一个非常明显的事情)
谢谢
我被要求尝试修改页面以在其他地方使用。
基本上,除了一个我无法解决的谜团之外,我所做的一切。
我基于的页面是https://wombatservers.com.au/theburrow
请注意顶部描绘 Minecraft 世界的大图像。好吧,基本上我不能让它填满屏幕的整个宽度(它需要在另一个项目中是特定的大小)。但是我一辈子都找不到控制的地方,底部的蓝色页脚也是如此。
因此,如果有人可以帮助我追踪这些元素的宽度被称为哪一行,那就太好了。
(我希望这是我忽略的一个非常明显的事情)
谢谢
以下css添加图像:
.pager {
background: url(../images/slide1.jpg) center center repeat-x;
padding: 50px 0 50px 0;
}
html 看起来像这样:
<div class="pager">
<div class="wrapper">
<div class="pager-title l">
<h1>The Burrow</h1>
<p>Tutorials, lessons, resources and a whole lot more!</p>
</div>
<div class="test-text r">
<h2>By far the best Aussie host I've ever used! No lag at all!<img src="images/bulate2.png" alt="" style="position:relative; margin-left:10px; margin-top:-15px;"></h2>
<p>— Jeremy, <a href="#">EmuCraft Australia</a></p>
</div>
<div class="c"></div>
</div>
</div>
您可能希望将寻呼机 div 放入包装器 div 中,如下所示:
<div class="wrapper">
<div class="pager">
<div class="pager-title l">
<h1>The Burrow</h1>
<p>Tutorials, lessons, resources and a whole lot more!</p>
</div>
<div class="test-text r">
<h2>By far the best Aussie host I've ever used! No lag at all!<img src="images/bulate2.png" alt="" style="position:relative; margin-left:10px; margin-top:-15px;"></h2>
<p>— Jeremy, <a href="#">EmuCraft Australia</a></p>
</div>
<div class="c"></div>
</div>
</div>
或者类似的东西,但是你必须对页脚做同样的事情。
两张图片都是背景,并且由于没有设置 background-size 属性,浏览器只使用图像文件的完整宽度并将其裁剪到 html 对象结束的位置。所以header图片的宽度是1600px,footer是1169px。但显示的大小取决于您的视口宽度。