집

类库下载

java类库

CSS 사용법

高洛峰

Oct 08, 2016 pm 03:36 PM

<br/>

로그인 후 복사

Css(Cascading Style Sheets, Cascading Style Sheets)는 CSS의 개체 속성을 편집하여 페이지를 아름답게 하는 효과를 얻는 페이지 미화 방법입니다. CSS의 기본 작업 단위는 객체입니다. CSS를 사용하는 것은 C++/C에서 함수를 사용하는 것과 같습니다. CSS 객체는 정의, 선언 및 호출을 통해 사용되는 함수와 같습니다.

CSS에는 세 가지 선택기(객체 정의 및 사용)가 있습니다: 태그 선택기, 카테고리 선택기, ID 선택기

CSS에는 인라인 스타일, 임베디드, 링크, import

태그 선택기:

정의: 참조된 스타일 객체 이름 {태그 속성: 속성 값; 태그 속성: 속성 값;…….}

예: h1,h2{text-align: center; color: red;}

사용:

……..

… …..

카테고리 선택기:

정의: 태그 이름.클래스 이름 {태그 속성: 속성 값; 태그 속성: 속성 값;…….} 또는

.클래스 이름 {태그 속성: 속성 값;….}

예: p.center{ text -align: center }

. 오른쪽{ 텍스트 정렬: 오른쪽; }

사용:

……..

,,,,, 클래스에서 정의한 스타일)

(예: .right{text-align: right;} 가 정의되어 있습니다. 호출 시 클래스를 통해 오른쪽 속성의 레이블을 호출하면 오른쪽이 표시될 수 있습니다.

…..

;

…… ……; 등의 태그는 모두 오른쪽 정렬 속성을 나타냅니다.

ID 선택기:

정의: #id 이름 {레이블 속성: 속성 값; 레이블 속성: 속성 값;…….}

예: #sample{font- family:宋体; don't-size:60pt;}

사용:

… …

인라인:

선택기를 정의할 필요가 없습니다. 스타일 속성을 사용하여 요소의 스타일을 직접 지정하세요

예: < ;p style=”color:#FF0000”>……

인라인:

먼저 선택기를 정의하고 < ;/head>에 스타일 시트를 정의합니다.

예:

<html>
        <head>
           <title>xxxxxx</title>
            <style type=”text/css”>
                p{color: #000FF;}
                .info{font-size: 12px;}
             </syle>
        </head>
 </html>

로그인 후 복사

링크 유형:

정의된 객체는 확장자가 .css인 파일에 별도로 배치되며, 사이에 태그를 사용하여 필요한 웹 페이지에 연결됩니다.

예:

가져오기 유형:

및 링크 유형 import 메소드를 통해 임포트된다는 점을 제외하면 메소드는 비슷합니다.

예:

CSS 스타일 시트 우선순위 :

삽입된 스타일 시트> 인라인> 개요> 브라우저 기본값