>웹 프론트엔드 >CSS 튜토리얼 >CSS에서 첫 글자를 사용하는 방법

CSS에서 첫 글자를 사용하는 방법

不言
不言원래의
2018-12-08 15:28:324111검색

첫 글자를 사용하면 블록 요소의 첫 글자에 스타일을 적용할 수 있으며, 이는 지정된 선택기의 첫 글자를 선택하는 데 사용할 수 있습니다. 그렇다면 CSS에서 첫 글자를 어떻게 사용할 수 있을까요? 첫 글자의 사용법을 자세히 살펴보겠습니다.

다음 사진은 "첫글자" 효과를 적용한 사진입니다

CSS에서 첫 글자를 사용하는 방법

첫 글자만 색칠하고 글꼴 크기를 300%로 설정했습니다.

다음으로 CSS에서 첫 글자를 사용하는 방법

CSS에서 첫 글자를 사용하는 방법의 구체적인 용도를 살펴보겠습니다.

p:CSS에서 첫 글자를 사용하는 방법{
   / *描述你想要应用的CSS样式* / 
 }

이것은 p에서 지정한 블록 요소입니다.

태그의 p를 가리키며,

태그를 적용하려면 h1로 변경하면 됩니다.

구체적인 예를 살펴보겠습니다

코드는 다음과 같습니다

HTML code

<html>
  <head>
    <meta charset="utf-8">
    <title>CSS에서 첫 글자를 사용하는 방법</title>
    <link rel="stylesheet" type="text/css" href="sample.css">
  </head>
  <body>
    <p>
    </p>
  </body>
</html>

CSS code

sample.css

p:CSS에서 첫 글자를 사용하는 방법{
  color:#5bc0de;
  font-size:300%;
}

실행 결과

는 다음과 같은 효과를 나타냅니다. 아래 브라우저에서

CSS에서 첫 글자를 사용하는 방법

p 뒤에는 "."이 아닌 ":"(콜론)이 옵니다.

단순히 실수하는 경우에는 전혀 적용되지 않으므로 주의하세요.

그리고 앞서 언급했듯이 p는 블록 요소입니다. 블록 요소는

태그의 p를 참조합니다.

에 적용하려면 h1로 변경하면 됩니다.

우리가 {}에서 작성한 CSS 스타일. 즉, 첫 글자에 가장 적용하고 싶은 스타일을 적어주시면 됩니다.

위 내용은 CSS에서 첫 글자를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.