집 > 기사 > 웹 프론트엔드 > CSS 인라인 스타일, 내장 스타일, 외부 참조 스타일 사용 방법에 대한 자세한 설명

CSS 인라인 스타일, 내장 스타일, 외부 참조 스타일 사용 방법에 대한 자세한 설명

王林앞으로: 2020-03-21 11:01:543428검색

세 가지를 사용하는 방법에 대한 간단한 예는 다음과 같습니다.

인라인 스타일:

<!doctype html>
<html>
<head>
 <meta charset="UTF-8">
 <title>css行内样式</title>
</head>
<body>
<div style="width:100px;height:100px;background:red;"></div>>
 
</body>
</html>

( 권장 튜토리얼: CSS 튜토리얼)

인라인 스타일:

<!!doctype html>
<html>
<head>
 <meta charset="UTF-8">
 <title>css内嵌样式</title>
</head>
<body>
<style type="text/css">
#div{width:100px;height:100px;background:red;}
</style>
<div id="div"></div>>
 
</body>
</html>

외부 스타일:

<!doctype html>
<html>
<head>
 <meta charset="UTF-8">
 <title>css内嵌样式</title>
 <link rel="stylesheet" type="text/css" href="ccss.css">
</head>
<body>
<div id="div"></div>>
 
</body>
</html>

css 파일: # 🎜🎜 #

#div{width:100px;height:100px;background:red;}

Summary:

인라인 스타일: 코드는 특정 웹페이지의 요소 내에 작성됩니다. 예: f0483ddc39c4fcca0559a85102768dc116b28748ea4df4d9c2150843fecfba68

Inline: 9c3bca370b5104690d9ef395f2c5f8d1 앞에만 씁니다. 예: 080b747a20f9163200dd0a7d304ba388. div{color: #F00}531ac245ce3e4fe3d50054a55f265927

외부 스타일: 외부 CSS 파일을 나타냅니다. 예: 6cdac92949cc0e4cfdef478d4b03c102

CSS 인라인 스타일, 내장 스타일, 외부 참조 스타일 사용 방법에 대한 자세한 설명

관련 기사