• Техногрет
  • Список, разделенный линиями

    HTML и CSSXSLTJavaScriptИзображенияСофтEtc
    Владимир Токмаков

    январь 2004


    Задача.

    Разделить линиями элементы списка.

    Как это выглядит в браузере

    • пункт 1
    • пункт 2
    • пункт 3
    01 
    02 
    03 
    04 
    05 
    06 
    07 
    08 
    09 
    10 
    11 
    12 
    13 
    14 
    15 
    16 
    17 
    18 
    19 
    20 
    <style type="text/css">
        ul.line-separated
        {
            background-color: blue;
            padding: 0;
            margin-left: 1em;
        }
        ul.line-separated li
        {
            background-color: white;
            margin: 1px 0 0 0;
            padding: 0;
            list-style-type: none;
        }
    </style>
    <ul class="line-separated">
        <li>пункт 1</li>
        <li>пункт 2</li>
        <li>пункт 3</li>
    </ul>