样式化替换Unicode的列表无法使其对齐

时间:2017-04-18 05:29:31

标签: list unicode styles

我在Stackoverflow上读过6或7个不同的线程,特别是用Unicode符号代替标准列表项目符号。一切都按照预期进行,但我不能让它保持一致。帮助赞赏。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
    <meta content="text/html; charset=us-ascii"
          http-equiv="Content-Type">

    <title>Stylin&rsquo; Lists</title>
    <style type="text/css">

    ul {
    list-style: none;
    margin-left: 0px;
    padding-left: 20px;
    text-indent: -20px;}

    li {padding-left: 20px;}

    li:before {
    content: "\25AC";
    padding-right: 10px;
    color: DODGERBLUE;}

    </style>
</head>

<body>
    <h2>Stylin&rsquo; Lists</h2>

    <div style=
    "font-family: Helvetica, Sans-Serif; font-size: 16px; line-height: 18px; font-weight: Bold;">
    <ul>
            <li>Lorem ipsum dolor sit amet, consectetuer adipiscing
            elit. Quisque sed felis.</li>

            <li>Etiam augue pede, molestie eget, rhoncus at,
            convallis ut, eros. Aliquam pharetra. Nulla in tellus
            eget odio sagittis blandit. Aliquam sit amet felis.
            Mauris semper, velit semper laoreet dictum, quam diam
            dictum urna, nec placerat elit nisl in quam. Etiam
            augue pede, molestie eget, rhoncus at, convallis ut,
            eros. Aliquam pharetra. Nulla in tellus eget odio
            sagittis blandit. Maecenas at nisl. Nullam lorem mi,
            eleifend a, fringilla vel, semper at, ligula.</li>

            <li>Molestie eget, rhoncus at, convallis ut, eros.
            Semper laoreet dictum, quam diam dictum urna, nec
            placerat elit nisl in quam. Aliquam pharetra. Nulla in
            tellus eget odio sagittis blandit. Maecenas at nisl.
            Nullam lorem mi, eleifend a, fringilla vel, semper at,
            ligula. Consectetuer adipiscing elit. Quisque sed
            felis.</li>

            <li>Placerat elit nisl in quam. Nullam lorem mi,
            eleifend a, fringilla vel, semper at, ligula. Etiam
            augue pede, molestie eget, rhoncus at, convallis ut,
            eros. Aliquam pharetra. Nulla in tellus eget odio
            sagittis blandit. Maecenas at nisl.</li>
        </ul>
    </div>
</body>
</html>

0 个答案:

没有答案