> 웹 프론트엔드 > CSS 튜토리얼 > CSS 코드를 html에서 어디에 배치할 수 있나요?

CSS 코드를 html에서 어디에 배치할 수 있나요?

奋力向前
풀어 주다: 2023-01-07 11:47:24
원래의
8980명이 탐색했습니다.

CSS 코드 위치: 1. 스타일 속성을 직접 사용하고 "" 구문으로 html 태그에 넣습니다. 2. 스타일 태그를 사용하여 CSS를 작성합니다. 문서 헤드의 코드 외부 태그에서 구문은 ""입니다.

CSS 코드를 html에서 어디에 배치할 수 있나요?

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

html에서 css 코드의 배치 위치

1. style 속성을 직접 활용하여 html 태그에 넣어줍니다

기본 구문 형식은 다음과 같습니다.

<element style="value">
로그인 후 복사

구문에서 style은 태그 속성입니다. 실제로 모든 HTML 태그에는 인라인 스타일을 설정하는 데 사용되는 style 속성이 있습니다. 속성 및 값의 작성 사양은 CSS 스타일 규칙과 동일합니다. 인라인 스타일은 해당 태그가 위치한 태그와 그 안에 중첩된 하위 태그에만 영향을 미칩니다. style是标签的属性,实际上任何HTML标签都拥有style属性,用来设置行内式。其中属性和值的书写规范与CSS样式规则相同,行内式只对其所在的标签及嵌套在其中的子标签起作用。

建议不要使用内联CSS,因为每个HTML标记都需要单独设置样式,如果您只使用内联CSS,管理网站可能会变得十分困难。但是,它在某些情况下很有用。例如,在您无法访问CSS文件或仅需要为单个元素应用样式的情况下。带有内联CSS的HTML页面示例如下所示:

Hostinger Tutorials

Something usefull here.

2、使用style标签把css代码集中写在HTML文档的head头部标签中

基本语法格式如下:

<head>
<style type="text/css">
css代码
</style>
</head>
로그인 후 복사

语法中,style标签一般位于head标签中title标签之后,也可以把他放在HTML文档的任何地方。

style type="text/CSS"

각 HTML 태그의 스타일을 별도로 지정해야 하고 인라인 CSS만 사용하면 웹사이트 관리가 매우 어려울 수 있으므로 인라인 CSS는 사용하지 않는 것이 좋습니다. 그러나 특정 상황에서는 유용할 수 있습니다. 예를 들어 CSS 파일에 액세스할 수 없거나 단일 요소에만 스타일을 적용해야 하는 경우가 있습니다. 인라인 CSS가 포함된 HTML 페이지의 예는 다음과 같습니다:

Hostinger Tutorials

여기에 유용한 내용이 있습니다.
2. 스타일 태그를 사용하여 HTML 문서의 head 태그에 CSS 코드를 작성합니다

기본 구문 형식 :

<head>
<style type="text/css">
p {color:white; font-size: 10px;}
.center {display: block; margin: 0 auto;}
#button-go, #button-back {border: solid 1px black;}
</style>
</head>
로그인 후 복사
구문에서 style 태그는 일반적으로 head 태그의 title 태그 뒤에 위치하며, HTML 문서의 아무 곳에나 배치됩니다. style type="text/CSS"는 HTML5에서 생략 가능하고, 사양에 더 부합하므로 이 곳에 쓰거나 생략하시면 됩니다. 🎜🎜예: 🎜rrreee🎜🎜확장된 지식: 🎜🎜🎜🎜HTML의 전체 이름은 일련의 태그를 포함하는 마크업 언어인 Hypertext Markup Language입니다. 이러한 태그는 네트워크의 문서 형식을 통합하고 분산된 인터넷 리소스를 논리적인 전체로 연결할 수 있습니다. HTML 텍스트는 html 명령으로 구성된 설명 텍스트입니다. HTML 명령은 텍스트, 그래픽, 애니메이션, 사운드, 테이블 및 링크 등을 설명할 수 있습니다. 우아한 프런트 엔드 웹 페이지를 구축하기 위해 주로 CSS+JS와 함께 사용됩니다. 🎜🎜추천 학습: 🎜CSS 비디오 튜토리얼🎜🎜

위 내용은 CSS 코드를 html에서 어디에 배치할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿