WEB Archive
[HTML] CSS - 가상 요소 적용 실습
universedevelope
2024. 8. 20. 14:17
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Test014.html</title>
<style type="text/css">
/* p에속한 전체문단 */
p {font-size: 9pt; color: red;}
/* 첫째줄.. first-line → 브라우저 기준.. */
p:first-line {font-size: 25px; color: blue;}
</style>
</head>
<body>
<div>
<h1>가상 요소 적용 실습</h1>
<hr>
</div>
<p>문단 태그를 활용하여 내용을 작성하고 있다.
이 태그 내부에 기술된 내용은 엘리먼트 선택자의 영향을 받고 있는 상황이다.
하지만, 이 영역 안에도 상황에 따른 스타일 적용이 가능하다.
첫라인의 텍스트는 글자색이 파란색이고 글꼴 크기는 25pt이다.
둘째 라인의 텍스트부터는 글자색이 빨간색이고, 글꼴 크기는 9pt가 된다...</p>
</body>
</html>첫째 라인의 텍스트를 꾸며주는
『p:first-line style』 을 적용시켜보았어요 ㅎㅎ
728x90