집 >웹 프론트엔드 >CSS 튜토리얼 >CSS와 HTML의 차이점은 무엇입니까? CSS와 HTML의 차이점 비교

CSS와 HTML의 차이점은 무엇입니까? CSS와 HTML의 차이점 비교

不言원래의: 2018-08-28 15:06:408367검색

프론트엔드를 배울 때 html과 css의 차이점을 잘 모르는 학생들이 많을 텐데요. 오늘 php 중국어 사이트에 올라온 글은 혹시 필요한 분들을 위해 html과 css의 비교를 정리한 것입니다. 특정 콘텐츠에서.

CSS와 html의 차이점:

1. 먼저 html을 살펴보겠습니다.

html은 HyperText Markup 언어인 HyperTextMark-upLanguage의 약어입니다.

html은 정의하는 데 사용됩니다. 문서의 콘텐츠 구조는 웹 페이지를 구성하는 기본 요소인 이미지, 텍스트, 비디오를 포함하여 사용자가 탐색해야 하는 콘텐츠를 포함합니다.

html은 웹 페이지의 구조(구조)입니다. 프레임셋, iframe, div+css 레이아웃, 테이블 레이아웃 등 다양한 프레임과 레이아웃이 필요하며 기본 양식, 입력 상자, 입력 상자 유형, 텍스트 필드 등을 포함한 양식 제출(HTML Form)도 지원합니다. 목록, 라벨 등

HTML의 구조는 Head와 Body의 두 부분으로 구성됩니다. Head는 브라우저에 필요한 정보를 설명하고 Body는 설명할 특정 내용을 포함합니다.

html에 대한 간단한 예를 살펴보겠습니다.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<h1>我的第一个标题</h1>
<p>我的第一个段落。</p>
</body>
</html>

효과는 다음과 같습니다.

CSS와 HTML의 차이점은 무엇입니까? CSS와 HTML의 차이점 비교

이 예는 html의 구조를 명확하게 설명할 수 있습니다. (관련 권장사항: HTML 중국어 참조 매뉴얼 및 2018 프런트엔드 소개_HTML5)

html의 기본 내용을 읽은 후 CSS의 기본 내용을 살펴보겠습니다. 결국 차이점을 비교해 보겠습니다. CSS와 html 사이^ _^

2. CSS를 다시 살펴보겠습니다.

css는 W3C 협회에서 개발하고 발표한 웹 페이지 레이아웃 표준인 Cascading Style Sheets의 약어입니다. HTML 언어 기능 추가에 대한 참조입니다.

CSS는 HTML 문서의 스타일, 즉 동적 텍스트, 텍스트 색상, 글꼴, 웹 페이지의 애니메이션 효과와 같은 모양을 정의하는 데 사용되며 모두 CSS로 구현할 수 있습니다.

CSS의 주요 목적은 웹 페이지의 글꼴, 색상, 배경, 이미지 및 기타 다양한 요소를 제어하여 웹 페이지가 디자이너의 요구 사항에 따라 정확하게 표시될 수 있도록 하는 것입니다.

아래 예시와 같이:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.com)</title>
<style>
body
{
	background-color:#d0e4fe;
}
h1
{
	color:orange;
	text-align:center;
}
p
{
	font-family:"Times New Roman";
	font-size:20px;
}
</style>
</head>

<body>

<h1>CSS例子</h1>
<p>这是一个段落。</p>

</body>
</html>

효과는 다음과 같습니다.

CSS와 HTML의 차이점은 무엇입니까? CSS와 HTML의 차이점 비교

위 효과는 CSS의 사용을 매우 명확하게 보여줍니다. (관련 추천: CSS 영상 튜토리얼-옥소녀 심경편)

위의 html과 css 기본 내용 소개를 통해 스타일에 주로 사용되는 CSS와 html의 차이점을 확실히 알 수 있습니다. . HTML은 텍스트 콘텐츠에 사용됩니다. 진지하게 공부하면 학습 과정에서 더 많은 것을 발견할 수 있습니다.

CSS와 HTML의 차이점은 무엇입니까? CSS와 HTML의 차이점 비교

관련 기사