如何用div包裹整张图片？当前使用Flexbox但方案不限于此

嘿，我帮你把这段布局代码和需求整理成清晰的Markdown格式啦，不管是自己参考还是后续提问都方便很多～

目前我正在使用 Flexbox 进行页面布局，但解决方案并不局限于Flexbox。以下是我的代码片段：

<!DOCTYPE html>
<html lang="en">
<head>
    <style>
        html { 
            font-family: Helvetica; 
            font-size: 22px; 
            color: seashell; 
            background-color: black; 
            opacity: 0.9; 
            text-align: center; 
        } 
        header { 
            display: flex; 
            align-items: center; 
            justify-content: space-between; 
            height: 69px; 
            border-bottom: 1px solid seashell; 
            position: fixed; 
            width: 100%; 
        } 
        img { 
            height: 50px; 
            padding-left: 10px; 
        } 
        nav span { 
            color: seashell; 
            padding-right: 30px; 
        } 
        a { 
            /* 这里的样式可以根据需求补充完整 */
        }
    </style>
</head>
<body>
    <header>
        <img src="你的图片路径" alt="Seashell风格Logo">
        <nav>
            <span><a href="#">导航链接1</a></span>
            <span><a href="#">导航链接2</a></span>
            <span><a href="#">导航链接3</a></span>
        </nav>
    </header>
    <!-- 页面主体内容放在这里 -->
</body>
</html>

小提醒： #

• 因为header用了position: fixed，记得给页面主体（比如<main>标签）加上padding-top: 70px左右的内边距，不然顶部内容会被导航栏挡住哦
• a标签的样式可以补充成和整体风格匹配的，比如color: seashell; text-decoration: underline;，这样导航链接看起来更统一

内容的提问来源于stack exchange，提问作者itsolidude