Question

试图使文本不仅左右对齐，而且与我在两侧的2个图形从上到下对齐

到目前为止，我可以使用以下命令使它从左到右居中：text-align：center; 但是似乎找不到正确的代码来使其垂直排列。我尝试垂直对齐：中间；但似乎不起作用。

<!DOCTYPE html>
<html lang = "en">
<head>
    <title></title>
    <meta charset="UTF-8" />
<style type="text/css">

body {
    background-color: black
}

#toprightmenu {
    max-width: 100%;
    height: auto;
    width: auto;
    float: right;


}

#topleftmenu {
    float: left;
    line-height: 0;

}

#shipname {
    color: white;
    margin-right: auto;
    margin-left: auto;
    vertical-align: middle;
    text-align: center;

}


.bottom {
    vertical-align: bottom;
    display: inline-block;
    line-height: 0;
}



</style>


<title></title>
</head>
<body>
<div id="topleftmenu">
    <img src="topleft.png" alt="Top Left Menu Bar">
</div>
<div id="toprightmenu">
    <img src="topright.png" alt="Top Right Menu Bar">
</div>
<div id="shipname">
    <h1>Ship Name</h1>
</div>
</body>
</html>

enter image description here

尝试在2张图像之间对齐文本

0 个答案: