CSS Note 1.6 vertical-align属性

关注

原创最新推荐文章于 2026-11-06 09:00:18 发布 254 阅读 AI 写同款· GEO 优化 ›

我装了10个ClawHub技能，这些最好用! ClawHub就是Clawdbot的"应用商店"。Clawdbot是手机ClawHub是App Store技能就是各种App装了技能，Clawdbot才能干更多事。这个技能解决了我的信息过载问题。为什么装我订阅了很多Newsletter。每天收到一堆长文章，根本看不完。怎么用“总结这篇文章的核心观点”“把这个Newsletter提炼成3个要点”“这篇技术博客有哪些可以实践的建议？安装命令真实体验现在我收到长文章，直接转发给Clawdbot。它会提炼出核心要点和行动清单。阅读详情

一、vertical-align/垂直对齐

二、示例

1、Html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="CSS/Test24.css">
</head>
<body>
    <div id="div4" >hello world
        <img src="杨贵妃.png" alt="">
        <img src="王昭君.png" alt="">
        <div id="div2"><img src="sp/sp3.png" alt=""></div>
    </div>
</body>
</html>

2、CSS

@charset "UTF-8";
img{
    width: 60px;
    height: 120px;
}
*{
    margin: 0;
    padding: 0;
}
#div2{
    display: inline-block;
    vertical-align: text-top;
}
#div1{
    display: inline-block;
}

三、效果