阻止一行文字？
我想创建一个内联块，它将呈现一些未知的宽度和高度。 （它内部会有一个表格，内容动态生成）。 此外，内联块应放置在一行文本内，如“我的文本（BLOCK HERE）”。 为了使它看起来很漂亮， 我试图让这个块垂直居中 。 所以如果这个块看起来像这样：
TOP
MIDDLE
BOTTOM
然后，文本行将显示为：“我的文本（[MIDDLE]）”（在行的上面和下面有TOP和BOTTOM）
这是迄今为止我所拥有的。
CSS
.example {
background-color: #0A0;
display: inline-block;
margin: 2px;
padding: 2px;
position: relative;
text-align: center;
}
HTML
<div class="example">TOP<br />MIDDLE<br />BOTTOM</div>
code {
background: black;
color: white;
display: inline-block;
vertical-align: middle;
}<p>Some text <code>A<br />B<br />C<br />D</code> continues afterward.</p> display: inline-block是你的朋友，你只需要构造的所有三个部分 - 在之前，“块”之后 - 是一个，然后你可以将它们全部垂直对齐到中间：
工作示例
（无论如何它看起来像你的照片;））
CSS：
p, div {
display: inline-block;
vertical-align: middle;
}
p, div {
display: inline !ie7; /* hack for IE7 and below */
}
table {
background: #000;
color: #fff;
font-size: 16px;
font-weight: bold; margin: 0 10px;
}
td {
padding: 5px;
text-align: center;
}
HTML：
<p>some text</p>
<div>
<table summary="">
<tr><td>A</td></tr>
<tr><td>B</td></tr>
<tr><td>C</td></tr>
<tr><td>D</td></tr>
</table>
</div>
<p>continues afterwards</p>