简体   繁体   English

LI左侧带有文本的垂直UL

[英]Vertical UL with Text On The Left Side Of The LI

Is it possible to make a vertical <ul> that displays the text on the left side of the list? 是否可以使垂直<ul>在列表的左侧显示文本?

The only example I can think of would be something like the Facebook timeline where you would have list items on the right side like normal and then list items on the left that have the list items. 我能想到的唯一示例是类似Facebook时间轴的项目,在该项目中,您会像正常情况一样在右侧具有列表项,然后在左侧具有列表项的列表项。 How would I do a list like the list items on the left? 我该如何做一个像左侧列表项的列表? (I understand that this isn't how the timeline is coded, but it's just the only visual example I could think of). (我知道这不是时间轴的编码方式,但这只是我能想到的唯一视觉示例)。

Yes...use CSS: 是的...使用CSS:

<style>
ul {direction: rtl;}
</style>

If you'd like to alternate left and right, you can put it into a class: 如果您想左右交替,可以将其放在一个类中:

<style>
.bulletonleft { direction:ltr; }
.bulletonright { direction:rtl; }
</style>

<ul>
    <li class="bulletonleft">Element 1</li>
    <li class="bulletonright">Element 2</li>
    <li class="bulletonleft">Element 3</li>
    <li class="bulletonright">Element 4</li>
    <li class="bulletonleft">Element 5</li>
    <li class="bulletonright">Element 6</li>
</ul>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM