Чат Telegram
Группа ВКонтакте
Новый комментарий


Vlad

Зачем в маркированном списке вы использовали цифры... Для это ведь лучше подходит нумерованный список? В браузере отражаться и маркировка и цифра... это не есть хорошо )))

ivashkevich

Верное замечание) Писал пример ночью - вот и результат

Dmixer

Артем,добрый день!Подскажите пожалуйста,у меня маркеры поменяны местами.Черный маркер имеет другую геометрическую форму.Это версия нотпэда,или я где-то допустил ошибку?Открывал через разные браузеры.

ivashkevich

Добрый день! Скиньте ваш код в комментариях, гляну. Мне кажется просто другая версия браузера.

Dmixer
<ul>
      <li>Крепления
         <ul>
            <li>MTB</li>
            <li>Look и SPD</li>
         </ul>
       </li>
 </ul>
ivashkevich

Всё норм, просто другой браузер. Маркеры можно и явно указать - http://htmlbook.ru/content/svoystva-spiskov

Dmixer

Благодарю!

WebShaker

Зачем в маркированном списке вы использовали цифры... Для это ведь лучше подходит нумерованный список? В браузере отражаться и маркировка и цифра... это не есть хорошо )))
ничего не понял из вышесказанного, можно поподробней?!

ivashkevich

Всё правильно говорите) Это проверка на внимательность была :)

WebShaker

То есть уже исправили? я уже подумал что там чтото неправильно.

ivashkevich

Да нет, там действительно стоит делать через нумерованный список и сейчас в уроке немного неправильно. Можете предложить исправление в комментариях.

ImmortalPsych

Доброго времени суток, автор! Спасибо за учебное пособие!
Вот код на нумерованный список с вложением (научился по твоему пособию))):

<ol>
    <li>1
        <ul>
            <li>1.1</li>
            <li>1.2</li>
        </ul>
    </li>
    <li>2</li>
</ol>
ivashkevich

Норм всё)

ImmortalPsych

Я тут такую речь бахнул, а потом смотрю, ты изменил комент)) Спасиб

ivashkevich

:D

Gosha.ryash

В данном случае получается, что человек выше решил только часть проблемы. Список первого порядка будет маркироваться только цифрами, но список второго все также и цифрой и точкой. Можно ли как-то задать цифрами именно 1.1 , 1.2 и прочие без точек левее них?

Хотя там у него и с первым порядком косяки
Зачем нужно писать <li>1 если <ol> итак осуществляет нумерацию. В результате он получит 1 1 и 2 2

ivashkevich

Можно, с помощью CSS, вот так.

expert12@yandex.ru
<!DOCTYPE html>
 <html>
   <head>
    <meta charset="utf-8">
    <meta name="keywords" content="Аффирмации, Холодинамика, НЛП">
    <meta name="description" content="Общий обзор систем саморазвития.. Теория и практика.  Учимся разбираться с собственными глюками.">
      <title>Саморазвитие и Личностный рост</title>
    <style type="text/css">
   UL { 
    list-style-type: circle; /* Маркеры в виде круга */
    list-style-position: outside; /* Маркеры размещаются за пределами текстового блока */
    color: darkblue; /* Цвет текста списка */
   }
  </style>
   </head>
   <body>
<!-- Здесь будет основной контент страницы-->
     <h1>Теория, тесты, практика</h1>
     <h2> Общий обзор систем саморазвития </h2>
      <p> текст - бла..бла...бла</p>
       <ul>
        <li> Самопрограмирование</li>
        <li> Трансформация убеждений</li>
        <li> Зачистка глюков</li>
       </ul>
     <h2> Где я сейчас? </h2>
       <p> тест </p>
     <h2> Немного практики</h2>
       <p> текст - бла...бла...бла</p>
        <ol>
         <li> Техника </li>
           <ol>
             <li>Важно знать</li>
             <li>Описание практики</li>
           </ol>
         <li> Техника </li>
         <li> Техника </li>
        </ol> 
    </body>
 </html>

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

  1. текст
    а. текст
    в. текст
  2. текст
    Как это сделать?
ivashkevich

Нужно задать отдельный класс в CSS:

.myList {
    type: 'a';
}

И применять его к нужному списку:

<ol class="myList">
expert12@yandex.ru

Спасибо

vikentjeva@mail.ru
<ul>
  <li>Виды орлов
    <ul>
      <li> Образ жизни орлов</li>
      <li>Пища орлов</li>
    </ul>
  </li>
  <li>Воспитание потомства</li>
</ul>
получилось так, буду дорабатывать
ivashkevich

Отлично

Kamic95
<h2>6. Шестой факт</h2>
    <ul>
    <li>Некоторые фильмы о дельфинах:
    <ul>
    <li>1.1. Художественный фильм «Зевс и Роксана» / Zeus and Roxanne (1997);</li>
    <li>1.2. Художественный фильм «Флиппер» / Flipper (1996).</li>
    </ul>
    </li>
    <li>Некоторые мультфильмы о дельфинах:
    <ul>
    <li>2.1. Мультсериал «Флиппер и Лопака» (1999—2004);</li>
    <li>2.2. Мультфильм «Дельфинёнок Муму» (2007).</li>
    </ul>
    </li>
    </ul>
Veronika
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="keywords" content="web, программист, разработчик, junior, html, php, резюме">
        <meta name="description" content="Талантливый начинающий программист, с горящими глазами. С удовольствием приму участие как в проектировании и разработке новых проектов, так и в доработке и совершенствовании существующих">
        <title>Лучший программист Шадрина Вероника</title>
        <link href="style.css" rel="stylesheet"/><!--подключенные внешние стили. находятся в файле style.css-->
    </head>
    <body>
<h1>Шадрина Вероника</h1>
<h2>Мои навыки</h2>
<ul>
<li>языки программирования
<ul>
    <li>HTML</li>
    <li>PHP</li>
    <li>CSS</li>
    <li>JavaScript</li>
</ul>
</li>
<li>программы
<ul>
    <li>notepad++</li>
    <li>Open Server</li>
    <li>PhpStorm</li>
</ul>
</li>
</ul>
<h2>Мой опыт работы</h2>
<ol start="3">
    <li>Google</li>
    <li>Facebook</li>
</ol>
     <script src="scripts.js"></script><!--подключенные внешние скрипты. находятся в файле scripts.js-->
    </body>
</html>
ivashkevich

Отлично

gudron145@yandex.ru
<!DOCTYPE html>
<html lang="ru">
    <head>
        <meta charset="utf-8">
        <meta name="keywords" content="список, алкаши, трезвенники">
        <meta name="description" content="Список">
        <title>Список</title>
        <link href="style.css" rel="stylesheet">
    </head>
    <body>
       <h1 align="center">Список алкашей</h1>
       <p>Алкаши</p>
           <ul>
             <li>Иванов</li>
             <li>Петров</li>
             <li>Сидоров</li>
             <li>Егоров</li>
             <li>Трясогузкин</li>
           </ul>
        <p>Трезвенники</p>
           <ol start="7">
             <li>Димитриев</li>
             <li>Фомин</li>
             <li>Сухов</li>
           </ol>
           <ul>
             <li>Первый уровень
                 <ul>
                    <li>Первый подуровень</li>
                    <li>Второй подуровень</li>
                 </ul>
             </li>
             <li>Второй уровень</li>
           </ul>
       <script src="scripts.js"></script>
    </body>
</html>
ivashkevich

Отлично

DoOzAa
<h1>Фильмы</h1>
        <p>
            <h2>Жанры:</h2>
            <ul>
                <ol start="0">
                <li>Боевеки
                    <ul>
                        <ol>
                        <li>Джон Уик</li>
                        <li>Рэмбо</li>
                        <li>Неудержимые</li>
                        </ol>
                    </ul>   
                </li>
                <li>Преключения
                    <ul>
                        <ol>
                        <li>К звёздам</li>
                        <li>Экипаж</li>
                        <li>Дивергент</li>
                        </ol>
                    </ul>
                </li>
                <li>И т.д .....</li>
                </ol>
            </ul>
        </p>
        <p>
            <h1>Сриалы</h1>
                <h2>Жанры:</h2>
            <ul>
                <ol start="2">
                <li>Детактивы
                    <ul>
                        <ol>
                            <li>След</li>
                            <li>Детактивы</li>
                        </ol>
                    </ul>
                </li>
                <li>Комедии
                    <ul>
                        <ol>
                            <li>Кухня</li>
                            <li>Семья</li>
                        </ol>
                    </ul>
                </li>
                <li>И т.д.....</li>
                </ol>
            </ul>   
        </p>
ivashkevich

Супер!

sshurdakov@gmail.com
<ol start="1">
    <li>Белый</li>
    <li>Желтый</li>
    <li>Зеленый</li>
    <li>Красный</li>
    <li>Синий </li>
    <li>Фиолетовый </li>
    </ol>
    <h3>Характиристики </h3>
    <ul>
    <li>1. Классификация размеров
    <ul>
    <li>1.1 S - 22x37x60 см</li>
    <li>1.2 M - 27x43x69 см</li>
    <li>1.3 L - 32x48x76 см</li>
    </ul> 
    </li>
    <li>2. Вес</li>
    </ul>
    </body>
ivashkevich

Отлично. Лучше добавляйте отступы для вложенных элементов списка.

sshurdakov@gmail.com

В смысле? можешь показать пример, пожалуйста.

ivashkevich

Просто слева добавлять отступы из пробелов. Ещё называется табуляцией.

ivashkevich
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<ol start="1">
    <li>Белый</li>
    <li>Желтый</li>
    <li>Зеленый</li>
    <li>Красный</li>
    <li>Синий</li>
    <li>Фиолетовый</li>
</ol>
<h3>Характиристики </h3>
<ul>
    <li>1. Классификация размеров
        <ul>
            <li>1.1 S - 22x37x60 см</li>
            <li>1.2 M - 27x43x69 см</li>
            <li>1.3 L - 32x48x76 см</li>
        </ul>
    </li>
    <li>2. Вес</li>
</ul>

</body>
</html>
Онлайн обучение PHP
Путь с полного нуля до джуниора!
Начать бесплатно
Логические задачи с собеседований