Как мне установить маркеры в верхней части текста?

#html #css

Вопрос:

Как мне установить маркеры в верхней части текста? Вот мой пример кода ниже…

 .article-bulletpnts li::marker {
    font-size: 8px; 
}  
 <ul class="article-bulletpnts">
        <li>
            European minnow priapumfish mosshead warbonnet shrimpfish 
            bigscale.Cutlassfish porbeagle shark ricefish walking catfish
        </li>
        <li>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do            
            eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut 
            enim ad minim veniam, quis nostrud exercitation
        </li>
</ul> 

Комментарии:

1. Шрифт размером 12 пикселей лучше центрирует его. Что значит «к вершине»?

2. Вы можете поместить свой текст в качестве подстрочного текста: <li> <sub>Your text here</sub> </li> .

3. Я пытаюсь поместить каждую точку маркера в верхней части текста, к которому они примыкают

4. М-Кодер, твой совет сработал. Спасибо

Ответ №1:

Причина вашей проблемы в том, что вы ориентируетесь только на ::маркер и делаете ::маркер 8 пикселей, но ваш шрифт имеет размер по умолчанию. Если вы собираетесь изменить размер маркера, то вы также должны соответствовать размеру шрифта li для него.

 li {
  font-size: 8px;
}
li::marker {
  font-size: 8px;
} 
 

Ответ №2:

Вы можете использовать вот так

например

 ul.article-bulletpnts li::marker {
  color: red;
  font-size: 1.5em;
} 
 <ul class="article-bulletpnts">
        <li>
            European minnow priapumfish mosshead warbonnet shrimpfish 
            bigscale.Cutlassfish porbeagle shark ricefish walking catfish
        </li>
        <li>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do            
            eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut 
            enim ad minim veniam, quis nostrud exercitation
        </li>
</ul>