当我得到低于760px的像素时，订单混乱了。我正在使用flexbox，因此如果它在760px以上，则它们并排放置。如果它们低于760px，则将它们堆叠起来。一旦它们堆叠起来，那就是我出错的地方。
760px以上：
低于760像素：
高于760像素是正确的，而低于760像素则图像应位于文本上方。
我知道您必须使用订单，但是由于某种原因，订单并没有改变。
@media screen and (max-width: 760px)
{
/*section :nth-child(1) {
order: 2;
}
*/
}
<div>
<h1>Museum of the Arts</h1>
<figure>
<img src="images/sunday.jpg" alt="sunday">
<figcaption>Sunday Afternoon on the Island of La Grande Jatte</figcaption>
</figure>
<section>
<p><span>Sunday Afternoon on the Island of La Grande Jatte</span>, painted in 1884, is one of Georges Seurat's most famous works. It is a leading example of pointillist technique, executed on a large canvas. Seurat's composition includes a number of Parisians at a park on the banks of the River Seine.
</section>
<section>
<p><span>Nighthawks</span> is a 1942 oil on canvas painting by Edward Hopper that portrays people in a downtown diner late at night. It has been described as Hopper's best known work and one of the most recognizable paintings in American art Within months of its completion, it was sold to the Art Institute of Chicago on May 13, 1942 for $3,000.</p>
</section>
<figure>
<img src="images/nighthawk.jpg" alt="Nigthawk">
<figcaption>Nighthawk</figcaption>
</figure>
</div>
最佳答案
在媒体查询中，添加：flex-direction: row-reverse;