Geek asks and answers

Is there a way to determine, using Javascript or CSS, which words are on which line in the client browser?

Say I have this HTML code:

<div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>

I want to determine which line the phrase is included in the client browser sed do eiusmod tempor, and from there determine where this line starts and ends. Is there any way to do this using javascript.

What I'm trying to do with this line is to put a border on the bottom and on the sides (so that the border on each side of this text is parallel to the sides of the area <div>in.).

I know if there is a solution, it will not be easy, but I agree, even if it is relatively difficult. In addition, I use jQuery if it has a way to do this.

Also, if there is a way with CSS, I would be even happier.

It roughly says that the highlighted part is the text I'm looking for, and the red line should represent that there is a border on it. enter image description here

+3
source share
2 answers

If you wrap the right words in between, you can apply styles to CSS.

Only CSS solution is used here, using pseudo-elements ::beforeand ::after. Huh!

Will not work for text spanning more than two lines, though ...

EDIT:

This is one though! Although the previous one will behave better in most cases.

+3
source

It is not possible to locate individual words within an element.

sed do eiusmod tempor <span> id, .

0

More articles:


All Articles