가상요소

html에서 인식하지 않는 가상의 요소

	<h1 class="h1tag">h1태그</h1>
    <h1 class="h2tag">h2태그</h1>
    <h1 class="h3tag">h3태그</h1>
    <h1 class="h3tag">h3태그</h1>

지정한 요소의 앞,뒤로 가상요소 추가

	<style>
        .h1tag::before {
            content: "new";
            background-color: chocolate; color: white;
            font-size: 10pt; border-radius: 8px;
            padding: 3px; margin: 5px;
        }
    </style>

	<style>
        .h2tag::after {
            content: "best";
            background-color: blue; color: white;
            border-radius: 8px; font-size: 10pt; margin: 5px;
            padding: 3px;
        }
    </style>

지정한 요소를 선택(드래그) 했을때

	<style>
        .h3tag::selection {
            background-color: orange; color: white;
        }
    </style>

지정한 요소의 홀수(odd), 짝수(even)에 스타일 추가

	<style>
        h1:nth-of-type(odd) {
            background-color: bisque;
        }
        h1:nth-of-type(even) {
            background-color: aquamarine;
        }
    </style>