css - 如何在 html5 或 <iframe> 标签中使用内联 css 样式(样式 ="vertical-alignment:middle;")

Question

**注意所有 <> 标签已被删除以允许代码显示**我已经玩了好几个小时了，如果不在设计结束时使用解决方法(即 Corel 绘图)，我就无法真正让它工作

*在我继续之前，

首先，网站 URL 是 AdventistAviation.com.au

其次，我能不能说...我知道这可以用样式表来完成...但是，在这种情况下...我不会那样做!!! (所以请不要用那个选项来烦我，除非下面的方法绝对行不通)

第三，下面我的问题的解决方法是创建已经在其自己的背景中居中的图像(与旁边的 Logo 大小相同)然后导入它(这是一个坏主意，因为如果在未来有人将主标题背景更改为白色以外的其他颜色......它会看起来很糟糕!)

1. 首先我添加图像(这没问题)

但是因为 avada 主题左边的 Logo 大约是 250×250 平方，标语文本不再居中在标题中(你可以想象比较上面的标志和下面的标志)

我正在使用 themeforest AVADA 主题。在主题选项>标题#4的横幅代码...

例如，我想在 iframe 中添加以下内联 css 样式，以垂直居中标语(即，将其降低到 Logo 中间的水平)

style="vertical-align: middle;"

<iframe src="http://image_URL.png" style=”vertical:align: middle;” width="200" height="200"></iframe>

这似乎与 1 中的方法没有任何不同。

<div style="vertical-align: middle;"><iframe src="http://image_URL.png" width="200" height="200"></iframe></div>

我希望如果我将 iframe 放在包含样式的标签中，我可能会实现我的目标......可惜它仍然不起作用。

我已经到了这样的地步，我的脑袋里塞满了无用的方法，我无法继续前进。

有人可以帮忙吗？

p.s 我曾尝试为 html 5 中的标签找到一些内联 css 样式教程(特别是关于垂直对齐样式)，但没有任何运气。

该死的 w3c 贬低了 html5 中的 html 垂直对齐方法!

Answer 1

@亚当:

一个简单的解决方案是更改此代码:

<div id="header-banner">
    <div style="vertical-align: middle;" height="170" width="500">
        <img src="https://googledrive.com/host/...etc..." width="400" height="200">
    </div>
</div>

仅此而已:

<div id="header-banner" style="margin-top: 70px;">        
        <img src="https://googledrive.com/host/...." width="400" height="200">
</div>