CSS3를 사용하는 세 가지 방법은 무엇입니까?-프런트엔드 Q&A-php.cn

CSS3를 사용하는 세 가지 방법은 무엇입니까?

WBOY

풀어 주다： 2022-01-24 11:15:38

원래의

2850명이 탐색했습니다.

css3을 사용하는 세 가지 방법: 1. 인라인 스타일, 구문은 ""입니다. 2. 내부 스타일, 구문은 ""; 3. 외부 스타일, 구문은 ""입니다.

CSS3를 사용하는 세 가지 방법은 무엇입니까?

이 튜토리얼의 운영 환경: Windows 10 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.

css3를 사용하는 세 가지 방법은 무엇인가요? 1. 인라인 스타일

인라인 스타일은 style 속성을 통해 설정되며 속성 값은 어떤 CSS 스타일이든 가능합니다.

  <!DOCTYPE html>
  <html>
  <head>
      <meta charset="UTF-8">
      <title>内联样式</title>
  </head>
  <body>
     <p style="background: red"> I  love  China!</p>
  </body>
 </html>

로그인 후 복사

　 표시 효과:

CSS3를 사용하는 세 가지 방법은 무엇입니까? 2. 내부 스타일

　 내부 스타일은 문서의 헤드 부분에 정의되며 스타일 태그를 통해 설정됩니다. 스타일을 스타일을 지정할 태그(p 태그)와 연결하려면 요소 선택기(p)를 사용해야 합니다.

  <!DOCTYPE html>
  <html>
  <head>
     <meta charset="UTF-8">
      <title>内联样式</title>
     <style type="text/css">
         p{ 
              background: green;
          }
    </style>
 </head>
 <body>
    <p> I  love  China!</p>
 </body>
 </html>

로그인 후 복사

　 효과:

CSS3를 사용하는 세 가지 방법은 무엇입니까? 3. 외부 스타일

문서 외부의 *.css에 CSS 스타일을 정의한 후, 문서의 헤드 부분에 있는 링크 요소를 통해 도입합니다.

  <!DOCTYPE html>
  <html>
  <head>
      <meta charset="UTF-8">
      <title>内联样式</title>
      <link rel="stylesheet" href="style.css">
  </head>
  <body>
      <p> I  love  China!</p>
</body>
 </html>

로그인 후 복사

　 Style.css 파일 내용:

p{ 
             background: yellow;
        }

로그인 후 복사

표시 효과:

CSS3를 사용하는 세 가지 방법은 무엇입니까? a. 외부 스타일 시트에서 다른 스타일 시트의 스타일을 가져옵니다.

위의 style.css를 Combine.css 파일로 가져옵니다

@import "style.css";
 body{
     background: red;
}

로그인 후 복사

Combine.css 파일을 HTML 파일로 도입

  <!DOCTYPE html>
  <html>
 <head>
      <meta charset="UTF-8">
      <title>document</title>
      <link rel="stylesheet" href="combine.css">
  </head>
  <body>
      <p> I  <span>love</span>  China!</p>
 </body>
 </html>

로그인 후 복사

　 효과:

CSS3를 사용하는 세 가지 방법은 무엇입니까? (동영상 공유 학습: