Lu4 Lu4 - 6 months ago 13
HTML Question

Css query to select inline-text separated by some element

How do you select text content via CSS query separated by some element, say you have:

Some text content
<div>Another content</div>
And additional content


And you would like to select
Some text content
and
And additional content

Answer

I do not think you can refer to the inline-text from the CSS because you do not have nothing to link with it. You can apply some styles to the container and then add an id for your text inside the div to make it different.

In this case, I take the root element * but the behaviour would be the same if you wrap your code in a container.

*{
  color: red;
}

#text{
  color: blue;
}
Some text content
<div id="text">Another content</div>
And additional content

EDIT: You can create the content with the different styles with pseudo class.

*{
  color: red;
}

div:before{
  content: "Some text content";
  display: block;
  color: blue;
}

div:after{
  content: "And additional content";
  display: block;
  color: blue;
}
<div id="text">Another content</div>

But in this case, you do not have the content created, you create it depending of your div.