Computer >> 컴퓨터 >  >> 프로그램 작성 >> CSS

CSS를 사용하여 선택기에서 텍스트의 첫 글자에 특별한 스타일을 추가하는 데 사용되는 요소


:first-letter 요소를 사용하여 문서 요소의 첫 글자에 특수 효과를 추가합니다. 다음 코드를 실행하여 텍스트의 첫 글자에 특별한 스타일을 추가할 수 있습니다 -

예시

<html>
   <head>
      <style>
         p:first-letter {
            font-size: 5em;
         }
         p.normal:first-letter {
            font-size: 10px;
         }
      </style>
   </head>
   <body>
      <p class="normal"> First character of this paragraph will be normal and will have font size 10 px;</p>
      <p>The first character of this paragraph will be 5em big as defined in the CSS rule above. Rest of the characters in this paragraph will remain normal. This example shows how to use :first-letter pseduo element to give effect to the first characters of any HTML element.</p>
   </body>
</html>