Как выровнять списки (ul и Li) в середине страницы

Мне было интересно, могу ли я сделать отображение неупорядоченных списков в середине страницы, содержание остается там, но текстовая точка остается в стороне.Как выровнять списки (ul и Li) в середине страницы

Я попытался использовать свойство text-align, чтобы достичь этого, хотя это не дает желаемого эффекта.

ul { 
 
    font-size: 16px; 
 
    font-family: Arial; 
 
    text-align: center 
 
}

<!DOCTYPE html> 
 
<html "lang=eng"> 
 
<head> 
 
    <title>Example</title> 
 
</head> 
 

 
<body> 
 
    <ul> 
 
    <Li></Li> 
 
    <Li></Li> 
 
    <Li></Li> 
 
    </ul> 
 
</body> 
 

 
</html>

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

источник

2015-05-18 HyperTextMarkupLanguage

ширина Добавить в уль {ширина: 100px;} и писать в тегах ул центра – divy3993

Спасибо за отзывы – HyperTextMarkupLanguage

Возможно, добавьте list-style-type:none; по стилю?

<div> 
 
    <ul style="font-size: 16px; font-family: Arial;list-style-type: none; text-align: center;"> 
 
    <li>1</li> 
 
    <li>2</li> 
 
    </ul> 
 
</div>

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
     <title>TODO supply a title</title> 
 
     <meta charset="UTF-8"> 
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
 
    </head> 
 
    <body> 
 
     <div> 
 
      <ul style="font-size: 16px; font-family: Arial;list-style-type: none; text-align: center;"> 
 
       <li>1</li> 
 
       <li>2</li> 
 
      </ul> 
 
     </div> 
 
    </body> 
 
</html>

источник

2015-05-18 09:19:16

Спасибо так это сработало! – HyperTextMarkupLanguage

обозначая фиксированный размер ул и сделать текст выравнивать к центру работал, если и означает, как этот путь

<html> 
<body> 
    <ul> 
     <li>1</li> 
     <li>2</li> 
    </ul> 
</body> 
</html> 

<style> 
    ul{ 
     width:100px; 
     height:20px; 
    } 
    li{ 
     text-align:center; 
    } 
</style>

источник

2015-05-18 09:23:57 hengecyche

Отлично, это именно то, что я хотел. Вот ваши баллы;) – HyperTextMarkupLanguage

Вместо того, чтобы устанавливать ширину к вашему ул, вам может пожелать сохранить эту динамику и вместо этого использовать margin: 0 auto, чтобы выровнять ваш неупорядоченный список по центру.

ul { 
 
    font-size: 16px; 
 
    font-family: Arial; 
 
    text-align: center; 
 
    margin: 0 auto; 
 
}

<ul> 
 
    <Li>1</Li> 
 
    <Li>2</Li> 
 
    <Li>3</Li> 
 
</ul>

источник

2015-05-18 11:21:13 jbutler483

Отличный ответ, это тоже работает :-) – HyperTextMarkupLanguage

Как выровнять списки (ul и Li) в середине страницы

ответ

Смежные вопросы