CSS를 사용하는 이유는 무엇입니까?
- 青灯夜游원래의
- 2020-11-23 14:47:523080검색
CSS를 사용하면 웹 페이지의 프리젠테이션 정보(스타일) 대부분 또는 전체를 HTML 파일에서 이동하여 스타일과 콘텐츠를 분리할 수 있습니다. 이렇게 하면 파일 크기가 줄어들고 네트워크 대역폭이 절약되며 스타일 코드 중복을 피할 수 있습니다. , 유지 관리가 더 쉬워집니다. 동일한 콘텐츠를 다양한 스타일로 사용하여 다양한 목적을 달성할 수 있습니다.
CSS를 사용하는 이유는 무엇인가요?
CSS는 문서의 정보 내용을 표시 방법이라는 사소한 문제와 분리하는 데 도움이 됩니다. 문서가 표시되는 방식에 관한 작은 사항을 문서 스타일이라고 합니다.
css는 웹 페이지의 프레젠테이션 정보 대부분 또는 전부를 (X)HTML 파일 밖으로 이동하여 스타일 시트에 보관합니다. 콘텐츠에서 스타일을 분리하면 다음과 같은 이점이 있습니다.
파일 크기 감소, 네트워크 대역폭 절약
중복 방지
유지 관리가 더 쉬워집니다.
사이트의 성능 정보는 핵심 콘텐츠와 분리되어 있어 사이트 디자이너가 짧은 시간 내에 전체 웹사이트에 다양한 수정을 가할 수 있습니다.
동일한 콘텐츠를 다양한 스타일로 사용하여 다양한 목적을 달성할 수 있습니다
CSS는 웹 페이지의 서식 지정 코드를 단순화하고 외부 스타일 시트도 브라우저에 의해 캐시에 저장되므로 작업 속도가 빨라집니다. 다운로드 및 표시 속도가 향상되고 업로드해야 하는 코드의 양도 줄어듭니다(반복 형식은 한 번만 저장되기 때문입니다). 웹사이트 형식이 저장되어 있는 CSS 스타일시트 파일만 수정하면 사이트 전체의 스타일과 특성을 변경할 수 있어 특히 페이지 수가 많은 사이트를 수정할 때 유용합니다. 이렇게 하면 웹 페이지를 하나씩 수정하는 것을 방지하고 작업량을 크게 줄일 수 있습니다.
귀하의 웹사이트에는 수천 개의 유사한 페이지가 있을 수 있습니다. CSS를 사용하면 모든 페이지에서 공유하는 공통 파일에 스타일 정보를 저장할 수 있습니다. 사용자가 웹 페이지를 열면 사용자의 브라우저는 페이지 콘텐츠에 대한 스타일만 로드합니다. 사용자가 웹페이지를 인쇄할 때 인쇄된 페이지를 읽을 수 있도록 다양한 스타일을 제공해야 합니다.
일반적으로 스타일보다는 페이지의 내용을 설명하기 위해 HTML을 사용하고, 내용보다는 페이지의 스타일을 지정하기 위해 CSS를 사용합니다. 물론 예외도 있으며 HTML은 스타일을 지정하는 몇 가지 방법을 제공할 수도 있습니다. 예를 들어 HTML에서는 a4b561c25d9afb9ac8dc4d70affff419 태그를 사용하여 텍스트를 굵게 표시할 수 있으며 6c04bd5ca3fcae76e30b72ad730ca86d 태그에 페이지의 배경색을 지정할 수 있습니다. CSS를 사용할 때는 일반적으로 모든 스타일 정보를 한 곳에 보관하기 위해 HTML의 스타일 지정 기능을 사용하지 않습니다.
연습: HTML 문서용 스타일 시트 만들기
스타일 시트 만들기
1. 이 파일이 스타일 시트입니다. 이름을 style1.css
2로 지정하고 다음 코드 줄을 복사한 후 파일을 저장하세요.
strong { color: red; }문서와 스타일시트를 연결하세요
1. 이 파일은 다음과 같습니다. 귀하의 문서. 원하는 대로 이름을 지정하세요.
2. HTML 파일에서 다음 코드를 복사하세요. bd72bfde891514677616a913ab9d9cad 줄에 자신만의 스타일 시트를 인용해 주세요.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Sample document</title>
<link rel="stylesheet" href="style1.css">
</head>
<body>
<p>
<strong>C</strong>ascading
<strong>S</strong>tyle
<strong>S</strong>heets
</p>
</body>
</html>자세한 프로그래밍 관련 지식은 방문해주세요: 프로그래밍 코스! !
위 내용은 CSS를 사용하는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!