有没有办法让文本的一部分左对齐，另一部分右对齐并保持在一行？我在类似的问题上尝试了一些类似的答案，但结果与我希望的不接近
示例:440 像素范围内左侧为 TANYA RUMPFF，右侧为 SONGS OF A BIRD
HTML:
</head>
<div class="dean">
<ul>
<li><a href="#">TANYA RUMPFF <p align="right">Songs of a bird</p></a></li>
<li><a href="#">STANCE OONK Bolwerk</a></li>
<li><a href="#">HARALD VLUGT Voor en na het meesterwerk</a></li>
<li><a href="#">CORINNE BONSMA Secret garden</a></li>
<li><a href="#">STEFAN KASPER Glitterkikkerlikker</a></li>
</ul>
</div>
<body>
</body>
CSS:
.dean {width:440px;
background-color:#74f4ff;
}
.dean ul {
padding-left:-12px;
list-style-type: none;
padding-left:0;
padding: 0;
}
.dean ul li {
list-style-position:inside;
}
.dean a:hover {
text-decoration:none;
color:#000;
background-color:#fff;
}
.dean li:hover{
margin-left:-14px;
color:#F90;
list-style-type:disc;
}
.dean ul a {
text-decoration:none;
display:block;
padding-left:20px;
width:400px;
color:#000;
font-family:Arial, Helvetica, sans-serif;
}
最佳答案
您可以 float 第一个元素并使用text-align:right;
li a{
display:block;
text-align: right;
}
li b {
float: left;
}<ul>
<li><a href="#"><b>TANYA RUMPFF</b>Songs of a bird</a>
</li>
</ul>关于html - css/html 在一个 href 中左右对齐，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35543276/