选择最后一行 <p> 元件

Question

I am aware of the :first-line selector in CSS, but I cannot find anything that will allow me to select the last line.

The reason I am trying to select the last line is because I want to be able to define the text-overflow and white-space attributes of the last line.

I am trying to avoid using JavaScript to form a solution.

Answer 1

Unfortunately there is no CSS selector that would apply.

You can however select the first line using the pseudo element :first-line . Unfortunately at the moment there is no equivalent for the last line.

Answer 2

I don't think this can be done with CSS alone. jQuery or a PHP function might be able to get want you what

Answer 3

IIRC, the only css control over the last line is text-align:

text-align-last: right;

I'm afraid javascript, or actually wrapping the last line in a span and styling that, is the only way. Below is the JS for reference.

var thetext = document.getElementById('some_element').innerHTML.split(/\r?\n/);
alert(thetext[thetext.length - 1]);

Answer 4

You can use only one line and give css : nth-child(3)

Here (3) denotes the number of a last line