Html 从blogger页面删除不需要的元素

我正试图在我的测试博客damianp1.blogspot.co.uk的名为“测试”的页面中嵌入一个iframe

我已经从页面中删除了很多不需要的项目，以尽可能多地腾出空间，但找不到id来删除iframe后面出现的蓝色框，也找不到iframe来容纳底部有灰色边框的白色框

以下是我迄今为止使用的代码：

<style type="text/css">

.blog-pager, .footer, .post-footer, .feed-links, #Attribution1, .comments, .post-title, .sidebar
{ display:none !important;}
.main-inner .columns {position: relative; left: -205px; top 50px; width: 1305;padding-left:0 !
important;padding-right:0 !important;}

</style>
</b:if>
<style>]

</style>

<div class="post-outer" style="width:1100px;">
<div id="outerdiv" style="width: 1200px; overflow: hidden">
<iframe width="1300" style="position: relative; left: -190px; top: -34px" height="600" 
src="http://wildlife-ramblings.blogspot.co.uk/" scrolling="yes" frameborder="0"></iframe>
</div>
</div>

.blog pager、.footer、.post footer、.feed链接、#attribute1、.comments、.post title、.sidebar
{显示：无！重要；}
.main内部.columns{位置：相对；左侧：-205px；顶部50px；宽度：1305；左侧填充：0！
重要；右填充：0！重要；}
]

有人能告诉我如何将所有内容正确地装配在一起，使iframe整齐地填充页面吗

---

非常感谢，达米安。

iframe后面的蓝色框位于此处：

.post-outer {
background-color: #eef8f8;
border: solid 1px #e8e8e8;

.main-outer {

要删除蓝色框，您可以隐藏“.post outer”或：

在需要的地方添加“！重要”

iframe后面的白色框位于此处：

.post-outer {
background-color: #eef8f8;
border: solid 1px #e8e8e8;

.main-outer {

要删除边框，请删除：

box-shadow: 0 1px 3px rgba(0, 0, 0, .15);

编辑：（基于不同的格式理念）

如果要扩展蓝色和白色部分，必须将博客的宽度扩展到与iframe相同或更大的宽度。 点击“模板”>橙色按钮，上面写着“定制”。 在加载的页面上，单击“调整宽度”

如果不想增加整个博客的宽度，可以使用条件标记仅影响该页面。若要仅影响该特定页面，请查找“/b:skin”，并在其下方粘贴以下代码：

 <b:if cond='data:blog.url == &quot;http://damianp1.blogspot.co.uk/p/test_6572.html&quot;'>
 <style>
 #Blog1 {
 width: 1200px !important;
 }
 </style>
 </b:if>

要将整个iframe向上移动（靠近页面顶部），请将-52px增加到-62px（或任何值）。要向下移动整个iframe（靠近页面底部），请将-52px减小到-42px或其他值

这应该是代码中唯一需要调整的部分

这是当您将上述代码复制并粘贴到您的blogger页面中时的快照：

---

使用您在上述帖子中的帮助，我刚刚在页面本身的html中尝试了这一点，似乎效果不错

<style type="text/css">

.blog-pager, .footer, .footer-outer, .post-footer, #sidebar-wrapper, #midsidebar-
wrapper, .gapad2, .post-header-line-1, .navbar, .feed-links, #Attribution1, .comments, 
.post-title, .sidebar { display:none !important;}

#Blog1 { width: 1100px; !important; } .main-outer { width: 1170px !important; }

</style>
</b:if>
<style>]
</style>

<iframe src="http://wildlife-ramblings.blogspot.co.uk/" style= border:3px #eef8f8 
solid;" name="Wildlife Ramblings" scrolling="yes" frameborder="1" marginheight="5px" 
marginwidth="5px" height="800px" width="100%"></iframe>

.blog pager、.footer、.footer outer、.post footer、#边栏包装、#中间边栏-
包装、.gapad2、.post-header-line-1、.navbar、.feed链接、#attribute1、.comments、，
.post title、.sidebar{display:none！重要；}
#Blog1{宽度：1100px；！重要；}。主要外部{宽度：1170px！重要；}
]
显示在iframe后面的蓝色框
底部带有灰色边框的白色框
。。。什么？我看不出你在描述什么。您好，在嵌入式iframe后面有两个框-一个带圆角的蓝色框和一个带圆角和灰色页脚的白色框-如果滚动到底部，则更容易看到。我要么想删除它们，要么改变它们的大小，使iframe适合它们。我还希望iframe能够正确地匹配页面。谢谢您的帮助。我几乎把它整理好了！我决定将iframe放在.post外部框和.main外部框中，而不是删除它们。我使用了这个代码…主外部。后外部{宽度：100%；浮点：左；！重要；}…我使用了这个代码。主外部{宽度：100%；float:left；！important；}尝试使它们变大，但它似乎不会影响它们的宽度。我发现的唯一影响它们的代码是。列{width:111%；float:left；！important；}展开蓝色.post外框，但不展开白色.main外框。这让我头疼！我在上面的答案中添加了新的编辑。如果这对您有效，请单击我的答案下方的复选标记。它将帮助我：）尝试我添加的编辑，在你已经尝试过的其他2个编辑下面。让我知道这种方法是否对你更有效。再次非常感谢Nik，如果你想看到最终结果，博客现在已经启动并运行了-thelensbirds.blogspot.co.uk
<style type="text/css">

.blog-pager, .footer, .footer-outer, .post-footer, #sidebar-wrapper, #midsidebar-
wrapper, .gapad2, .post-header-line-1, .navbar, .feed-links, #Attribution1, .comments, 
.post-title, .sidebar { display:none !important;}

#Blog1 { width: 1100px; !important; } .main-outer { width: 1170px !important; }

</style>
</b:if>
<style>]
</style>

<iframe src="http://wildlife-ramblings.blogspot.co.uk/" style= border:3px #eef8f8 
solid;" name="Wildlife Ramblings" scrolling="yes" frameborder="1" marginheight="5px" 
marginwidth="5px" height="800px" width="100%"></iframe>