:: раньше непосредственно не работал в css

Question

Я попытался использовать :: перед элементом в HTML напрямую. мой код ниже

<ul class="clear toogled" style="height:188pxl"> 
<li tabindex="0" style="display: block;"> 
<label for="MAP-IA_1_1_OR_CB_1" aria-label="Filter by product"> 
::before 
hello 
</label> 
</ul> 

это будет дает выход как этот

::before 
hello 

почему он дает такой вывод?

Answer 1

Я точно не знаю, на что вы нацелены, но, как уже отмечали другие, вы не используете псевдоэлемент «before».

В основном, те :: до и после :: элементы, которые вы видите на DOM являются автоматически вставляется в DOM с помощью CSS псевдо классов :before и :after.

Например, используя свой код, я могу поставить кружку кофе перед вашим «привет».

label:before{ 
 
    content:"\2615"; 
 
}

<ul class="clear toogled" style="height:188pxl"> 
 
    <li tabindex="0" style="display: block;"> 
 
    <label for="MAP-IA_1_1_OR_CB_1" aria-label="Filter by product"> 
 
    hello 
 
    </label> 
 
    </li> 
 
</ul>

Все, что я сделал, было создать селектор CSS label:before и установить его содержание в юникода характер, который в основном говорит, прежде, чем что-либо внутри этикетки, я хочу показать content.

Если вы изучите сайт Samsung, с которого вы скопировали HTML, вы можете проверить, что они делают то же самое.

Вот resource Я использовал, когда я изначально начал изучать псевдокласс класса :before.