» »

Как убрать точки li маркеры из списка

Как убрать точки li маркеры из списка

Здесь разберем тему как можно убрать точки, которые появляются при создание списков или навигаций на сайте, думаю многие встречали. Так как выставляешь меню или категорий, то в самом начале появляется точка и их кода или стиля ее не возможно убрать. Здесь только один выход, это запретить показывать. Она может создаться при случай, когда li присутствует.

Но вообщем ближе к теме, идеи в CSS и в самый низ припишем стиль, что как раз будет отвечать за то, чтоб не выводил.

Код
li {
list-style-type: none; /* Убираем точки маркеры */
}

Так как сам недавно прописывал шрифтовые иконки и на одной, которая была под ссылкой на категорию появилась она, что пришлось таким способом воспользоваться.
24.09.2017 Просмотров: 362 Комментарий: (11)

Поделиться в социальных сетях

Материал разместил

Комментарий: 11
Alex_L_X
Alex_L_X 25.09.2017 17:361
0
Можно не только убрать, но и красиво оформить списки
Kosten
Kosten 25.09.2017 18:592
0
Alex_L_X, просто убрать и уже намного красивее.
workman
workman 25.09.2017 19:303
0
А можно и так ... И будут кружочки вместо точек 04b

Код
ol, ul {list-style: none;list-style-type: none;}
.petit {list-style-type: circle;}
<ul class="petit">
<li>ля-ля-ля</li>
</ul>
DESTEQ
DESTEQ 25.09.2017 20:229
0
а можно и так... тогда будут квадратики вместо кружочков :D
Код
list-style-type: square;
Kosten
Kosten 25.09.2017 20:4310
0
Не разу не встречались в форме квадрата, основном кругляки.)))
workman
workman 25.09.2017 21:2711
0
Маркированный список
Код
circle //Маркер в виде кружка.
disc  //Маркер в виде точки.
square //Маркер в виде квадрата.

Нумерованный список
Код
armenian //Традиционная армянская нумерация.
decimal  //Арабские числа (1, 2, 3, 4,...).
decimal-leading-zero //Арабские числа с нулем впереди для цифр меньше десяти (01, 02, 03,...)
workman
workman 25.09.2017 19:344
0
Ну а можно и картинку влупидолить 04b Просто поставить и настроить стили с :before

Код
ul li{
list-style:none;
line-height:30px;
}
ul li:before {
content:"";
background:url(images.jpg);
float:left;
width:15px;
height:15px;
margin-right:10px;
background-repeat: no-repeat;
}
workman
workman 25.09.2017 19:385
0
Ну или еще проще так. И вещественно все правим под себя

Код
ul {
padding:0 0 0 10px;
}
ul li{
list-style:none;
background: url('/images/.jpg') left center no-repeat;
padding:4px 0 4px 25px;
}
Kosten
Kosten 25.09.2017 19:406
0
Что то подсказывало, что тема актуальна, просто у самого давно где то стиль прописан))) А здесь на тестовом проверял и эти точки появились, что пришлось стилями запрет на них поставить.
workman
workman 25.09.2017 19:498
0
Ну а я если оставляю так просто иной раз от безделья. Но когда делаешь форму обертывая ее с помощью li настраивая под мобилку,то тогда конечно нужно убирать
workman
workman 25.09.2017 19:417
0
Кому помог, можно не зазнаваться и хотя бы воткнуть на репу в профиле ... Иначе убегу ))) 11a
avatar