CSS Property: list-style

The list-style property is a shorthand property for list-style-type, list-style-position, and list-style-image properties. If one of the values is missing, the default value for the missing property will be applied.

EXAMPLE

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>list‑style</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Bootstrap Icons CDN -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" rel="stylesheet">

    <style>
        /* Global box‑sizing */
        *, *::before, *::after { box-sizing: border-box; }

        /* Remove default list bullets – we’ll insert icons ourselves */
        ol {
            list-style: none;
            padding-left: 0;
            margin-left: 0;
        }

        /* Base styling for each list item */
        li {
            display: flex;
            align-items: center;
            gap: 0.6rem;               /* space between icon and text */
            margin-bottom: 0.5rem;
            font-size: 1.1rem;
        }
    </style>
</head>

<body>
    <ol aria-label="Seznam tehnologij">
        <li><i class="bi bi-file-earmark-code icon" aria-hidden="true"></i>HTML</li>
        <li><i class="bi bi-palette2 icon" aria-hidden="true"></i>CSS</li>
        <li><i class="bi bi-code-slash icon" aria-hidden="true"></i>JavaScript</li>
    </ol>
</body>
</html>

RESULT