CSS를 HTML에 삽입하는 방법은 무엇입니까?-CSS 튜토리얼-php.cn

CSS 스타일을 HTML에 삽입하는 세 가지 주요 방법이 있습니다.

1. 인라인 스타일이라고 하는 태그의 속성을 설정합니다. 태그는 HTML의 태그에 사용되며, 이를 내장 스타일이라고 합니다. 3. 외부 스타일 시트라고 하는 외부 CSS 파일을 생성하고 연결합니다. 属性，称为内联样式；

2、在HTML的

标签中使用 标签，称为嵌入式样式； 3、创建并链接外部CSS文件，称为外部样式表。 基本样式表通常修改html标记的外观，如 和 。在头文件中使用CSS文件或样式表时，我们还可以定义样式类，并使用 class="?"기본 스타일 시트는 일반적으로 및 와 같은 html 태그의 모양을 수정합니다. 헤더 파일에서 CSS 파일이나 스타일시트를 사용할 때 스타일 클래스를 정의하고 class="?" 속성을 사용하여 모든 요소에 적용할 수도 있지만 이는 이 간단한 가이드의 범위를 벗어납니다. 인라인 스타일 특징: 1) 인라인 스타일은 코드의 HTML 요소에 배치됩니다. 2) 인라인 스타일을 사용할 때 스타일은 선택한 요소에만 영향을 미칩니다. 3) 인라인 스타일에는 선택기가 없습니다 참고: HTML에 정의된 인라인 스타일은 추가된 태그에만 적용됩니다. Some red text

장점: 1. 변경 사항을 테스트하고 미리 보고 싶을 때 매우 유용합니다. 2. 빠른 수리에 매우 유용합니다. 3. HTTP 요청을 줄입니다. 단점: 인라인 CSS는 모든 요소에 적용되어야 합니다. Embedded style 특징: 1) 스타일 태그 /style>로 작성된 웹페이지의 헤드 부분에 배치됩니다. 2) 작성된 스타일은 해당 스타일을 사용하는 웹페이지에만 사용됩니다. 3) 삽입된 스타일을 "내부 스타일"이라고도 합니다. 헤더에 정의된 스타일은 페이지 전체에 적용됩니다. 아래 예에서는 페이지의 모든 h1 태그가 제목을 빨간색으로 표시하도록 합니다. h1 { color: red; } 장점: 1. 스타일 시트는 한 페이지에만 영향을 줍니다. 2. 내부 스타일 시트는 클래스와 ID를 사용할 수 있습니다. 3. 여러 파일을 업로드할 필요가 없습니다. HTML과 CSS는 같은 파일에 있을 수 있습니다. 단점: 1. 페이지 로딩 시간이 늘어납니다. 2. 한 페이지에만 영향을 미칩니다. 여러 문서에서 동일한 CSS를 사용하려는 경우에는 쓸모가 없습니다. 외부 스타일 시트 HTML 파일과 마찬가지로 CSS 파일은 일반 텍스트이며 일반적으로 .css 파일 확장자를 가지며 특정 태그를 통해 HTML 파일에 연결할 수 있습니다. 특징: 1) 별도의 문서에 작성한 후 다양한 웹 문서에 첨부 2) 수정하면 호출하는 모든 페이지에 영향을 미칠 수 있음 3) 조작이 용이함 예를 들어, style.css 파일의 내용은 다음과 같습니다. body { background-color: beige; color: #000080;} h1 { color: red;} 그런 다음 를 사용하여 헤더에 적용할 수 있습니다. 장점: 1. HTML 페이지의 크기가 더 작고 구조가 더 명확합니다. 2. 로딩 속도가 빨라졌습니다. 3. 동일한 .css 파일을 여러 페이지에서 사용할 수 있습니다. 단점: 외부 CSS가 로드될 때까지 페이지가 올바르게 렌더링되지 않을 수 있습니다. 🎜

관련 기사