Мне нужен неупорядоченный список без каких-либо пуль - PullRequest
Новая
       70

Мне нужен неупорядоченный список без каких-либо пуль

2324 голосов
/ 22 июня 2009

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

Можно ли иметь список без маркеров?

Ответы [ 27 ]

0 голосов
/ 16 апреля 2019

Если вы используете ul в блоке div, тогда 

// HTML file
<div class="some-class">
    <ul>
        <li>One</li>
    </ul>
</div>

В вашей таблице стилей 

.some-class ul {
       list-style: none;
}

Если вы просто используете ul напрямую без какого-либо класса или блока div: 

//Style Sheet
ul {
    list-style: none;
}
0 голосов
/ 26 апреля 2018 
 <div class="custom-control custom-checkbox left">
    <ul class="list-unstyled">
        <li>
         <label class="btn btn-secondary text-left" style="width:100%;text-align:left;padding:2px;">
           <input type="checkbox" style="zoom:1.7;vertical-align:bottom;" asp-for="@Model[i].IsChecked" class="custom-control-input" /> @Model[i].Title
         </label>
        </li>
     </ul>
</div>
0 голосов
/ 20 апреля 2018

Как упоминалось ранее, лучший способ сделать это - добавить list-style-type: none к элементу ul . Есть отличная статья о стилях пули Я думаю, вы могли бы извлечь выгоду из здесь .

0 голосов
/ 28 июня 2017

Приведенный ниже код является хорошим и простым примером удаления маркеров для неупорядоченного списка. 

<!DOCTYPE html>
<html>
    <body>

    <h2>Unordered List without Bullets</h2>

    <ul style="list-style-type:none">
        <li>Coffee</li>
        <li>Tea</li>
        <li>Milk</li>
    </ul>

    </body>
</html>
0 голосов
/ 03 июня 2017

Просто измените list-style-type или list-style в вашем классе на none для <li>.

Примерно так: 

li {
  list-style-type : none;
}

Также для получения дополнительной информации я перечисляю все свойства, которые вы можете присвоить list-style-type, запустите приведенный ниже код, чтобы увидеть все результаты в одной цели: 

.none {
  list-style-type: none;
}

.disc {
  list-style-type: disc;
}

.circle {
  list-style-type: circle;
}

.square {
  list-style-type: square;
}

.decimal {
  list-style-type: decimal;
}

.georgian {
  list-style-type: georgian;
}

.cjk-ideographic {
  list-style-type: cjk-ideographic;
}

.kannada {
  list-style-type: kannada;
}

.custom:before {
  content: '◊ ';
  color: red;
}
<ul>
  <li class="none">none</li>
  <li class="disc">disc</li>
  <li class="circle">circle</li>
  <li class="square">square</li>
  <li class="decimal">decimal</li>
  <li class="georgian">georgian</li>
  <li class="cjk-ideographic">cjk-ideographic</li>
  <li class="kannada">kannada</li>
  <li class="none custom">custom</li>
</ul>
0 голосов
/ 20 апреля 2016

Вы можете удалить "bullets" , установив "list-style-type: none;" Like 

ul
{
    list-style-type: none;
}

OR 

<ul class="menu custompozition4"  style="list-style-type: none;">
    <li class="item-507"><a href=#">Strategic Recruitment Solutions</a>
    </li>

</ul>
0 голосов
/ 15 марта 2013

Если вы хотите сохранить простоту, не прибегая к CSS, я просто добавлю &nbsp; в мои строки кода. Т.е. <table></table>.

Да, это оставляет несколько пробелов, но это неплохо.

Страница:
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...