Czy istnieje selektor CSS do zaznaczania tekstu (wstawione bloki) w prostokątnym polu?

Question

Czy reguła CSS może wybrać część pola zawierającego tekst (lub blok wbudowany)?

Na przykład fragment HTML jak <p>The quick brown fox jumped over the lazy dog</p> mogą być rozmieszczone tak:

+--------------------------+ 
| The quick brown fox  | 
| jumped over the   | 
| lazy dog    | 
+--------------------------| 

Jeśli utworzyć regułę CSS jak p { background: red } wtedy cała skrzynka/prostokąt będzie miał na czerwonym tle, w tym „spacji "na końcu każdej linii.

Czy istnieje sposób określenia selektora w taki sposób, że w każdym wierszu tylko faktyczny tekst ma czerwone tło?

Zauważyłem, że domyślnie kursor zmienia się z "strzałki" na "i-wiązkę", gdy faktycznie jest nad tekstem; gdy jest w innym miejscu w polu akapitu, a nie nad tekstem, to jest to strzałka, a nie belka.

Jeśli określę wyraźną regułę, taką jak p { cursor: crosshair }, wówczas będzie ona skuteczna wszędzie w prostokątnym polu. Znowu, czy jest możliwe, aby reguła została wybrana tylko wtedy, gdy kursor faktycznie znajduje się nad tekstem?

Answer 1

Co można zrobić, to zawinąć tekst w przęsła elementu, a następnie ustawić tle i kursor własności do niego.

Answer 2

Nie ma sposobu, aby zrobić dokładnie to, co chcesz, o ile wiem, ponieważ selektory CSS nie pasują do węzłów tekstowych. Trzeba będzie zawinąć tekst w przęśle, a następnie nadać mu styl.

Answer 3

jsut prosty fragment kodu, aby pomóc może:

dodany styl lub dwa extra..not konieczne chociaż .. nadzieję, że to pomaga ..

p { 
    background-color: gray; 
    width: 700px; 
    height: 500px; 
    margin:auto; 
} 

span { 
    background-color: red; 
    width: 500px; 
    height: 200px; 
    border: 2px blue; 
    border-style: dotted dashed; 
    font-size: 2em; 
    display: block; 
    margin:auto; 
}