java数组反转和排序_反转和重新排序HTML列表

java数组反转和排序

Once you’ve spent the extra time adding correct markup to your HTML list structure, it seems that there should be an easy way to reverse and re-order list items. Unfortunately the techniques to do so are relatively unknown. Many well-meaning developers give up trying to find a solution, and fall back to using paragraph markup with hand-hinted numbers. In reality, the answers are not hard, especially if you’re using HTML5.

一旦花了额外的时间向HTML列表结构中添加了正确的标记，似乎应该有一种简单的方法可以对列表项进行反向和重新排序。 不幸的是，这样做的技术相对未知。 许多好心的开发人员放弃了寻找解决方案的尝试，而转而使用带有手动提示数字的段落标记。 实际上，答案并不难，尤其是在使用HTML5的情况下。

使用任意数字启动或重新启动有序列表 (Starting or Re-starting An Ordered List With an Arbitrary Number)

By default ordered lists always start at the first counting integer. This becomes problematic if you have a list interrupted by another element, such as a paragraph:

默认情况下， 有序列表始终从第一个计数整数开始。 如果您的列表被另一个元素(例如段落)打断，则这将成为问题：

<h2>My Top Five Movies</h2>
<ol>
	<li>Star Wars
	<li>The Matrix
	<li>Mr. & Mrs. Smith
	<li>Wanted
</ol>
<p>Yes, I know those are Angelina Jolie movies. What can I say? I’m a fan.
<ol>
	<li>Rashomon
</ol>

The Akira Kurosawa film will be appear as 1: an ordered list always restarts by default. You can change this by using the start attribute on the second list with an appropriate number value:

黑泽明的电影将显示为1 ：默认情况下，有序列表始终会重新启动。 您可以通过使用第二个列表上的start属性和适当的数字值来更改此值：

<ol start=5>
	<li>Rashomon
</ol>

The result looks like this:

结果看起来像这样：

我的前五部电影 (My Top Five Movies)

1. Star Wars
   星球大战
2. The Matrix
   矩阵
3. Mr. & Mrs. Smith
   史密斯夫妇
4. Wanted
   通缉

Yes, I know those are Angelina Jolie movies. What can I say? I’m a fan.

是的，我知道那是安吉丽娜·朱莉的电影。 我能说什么 我是一个粉丝。

1. Rashomon
   罗生门

反向清单 (Reversed Lists)

If you wanted to create a countdown list from 5 to 1, add reversed to the <ol> element:

如果要创建从5到1的倒数列表，请在<ol>元素中添加reversed的内容：

<h3>Countdown Sequence Start</h3>
<ol reversed>
	<li>Ignition
	<li>Engine start
	<li>Liftoff
</ol>

Produces:

产生：

倒数计时开始 (Countdown Sequence Start)

1. Ignition
   点火
2. Engine start
   启动引擎
3. Liftoff
   起飞

Two things to note:

需要注意的两件事：

1. This does not reverse the content, but the count. If you wanted to reverse the actual elements, you could use flexbox to do so.

   这不会反转内容 ，而是计数 。 如果要反转实际元素，可以使用flexbox来实现。

2. reverse works in all modern browsers, with the exception of (surprise) Microsoft Internet Explorer and Edge.

   除了(惊奇的)Microsoft Internet Explorer和Edge之外， reverse在所有现代浏览器中均可使用。

翻译自: https://thenewcode.com/688/Reversing-and-Re-ordering-HTML-Lists

java数组反转和排序