CSS brother element chooses questions and asks for advice.

Code:

<a href="">1</a><span></span><a href="">2</a>
span + a {...}

question: you can choose the next one with the plus sign, so can you choose the one in front of you?

Mar.30,2021

first of all, to be clear, there is no pre-selector. The reason has been given upstairs.

however, you can think in a different way

if you change the existing structure and then use direction:rtl to change the display order, you can use + to achieve the effect of the front selector

.
<style>
.demo{direction:rtl}
.demo span + a { ... }
</style>
<div class="demo">
    <span>2</span><a href="">2</a><span>1</span><a href="">1</a>
</div>

you can take a look at my article http://118.24.110.50/blog/art.

.

there are relevant implementation ideas


currently there is no such selector, otherwise the front will have to re-render after rendering to the back and then modify the style in front of it.


the current CSS may not be able to do so. If you want to implement such logic, you can either use js to implement it, or use another way of thinking to avoid the problem.


the front selector is not available.
guess the reasons as follows:

  • the process of browser rendering is sequential, and the following tag will not be loaded until the previous tag has been fully loaded
  • if a front selector exists at this time, rendering after the rear tag is loaded may cause page jitter (a new style is applied during loading)
Menu