主页
HTML 参考手册
HTML <img> 标签
tryhtml_img_align_css
运行 ❯
×
更改方向
保存代码
更改主题
<!DOCTYPE html> <html> <body> <h1>使用 CSS 对齐图像</h1> <h2>vertical-align: bottom</h2> <p>这是一些文字。 <img src="/demo/images/smiley.gif" alt="笑脸" width="42" height="42" style="vertical-align:bottom"> 这是一些文字。 这是一些文字。 这是一些文字。</p> <h2>vertical-align: middle</h2> <p>这是一些文字。 <img src="/demo/images/smiley.gif" alt="笑脸" width="42" height="42" style="vertical-align:middle"> 这是一些文字。 这是一些文字。 这是一些文字。</p> <h2>vertical-align: top</h2> <p>这是一些文字。 <img src="/demo/images/smiley.gif" alt="笑脸" width="42" height="42" style="vertical-align:top"> 这是一些文字。 这是一些文字。 这是一些文字。</p> <h2>float: right</h2> <p>这是一些文字。 <img src="/demo/images/smiley.gif" alt="笑脸" width="42" height="42" style="float:right">这是一些文字。 这是一些文字。 这是一些文字。</p> <h2>float: left</h2> <p>这是一些文字。 <img src="/demo/images/smiley.gif" alt="笑脸" width="42" height="42" style="float:left">这是一些文字。 这是一些文字。 这是一些文字。</p> </body> </html>