CSS3 그게 무슨 뜻이야?

css3은 CSS 계단식 스타일 시트 기술의 업그레이드 버전으로 1999년에 공식화되었습니다. 2001년 5월 23일 W3C는 주로 상자 모델, 목록 모듈, 하이퍼링크 방법, 언어 모듈, 배경을 포함하는 CSS3 작업 초안을 완성했습니다. 테두리, 텍스트 효과, 다중 열 레이아웃과 같은 모듈.

이 문서의 운영 환경: windows7 시스템, css3 버전, Dell G3 컴퓨터.

CSS3은 CSS(Cascading Style Sheets) 기술의 업그레이드 버전으로 1999년에 공식화되었습니다. 2001년 5월 23일 W3C는 주로 상자 모델, 목록 모듈, 하이퍼링크 방법, 언어 모듈을 포함하는 CSS3 작업 초안을 완성했습니다. , 배경 및 테두리, 텍스트 효과, 다중 열 레이아웃 및 기타 모듈.

CSS 발전의 주요 변화는 CSS3를 일련의 모듈로 나누기로 한 W3C의 결정입니다. 브라우저 공급업체는 CSS의 속도에 맞춰 빠르게 혁신하므로 모듈 접근 방식을 채택하면 다양한 브라우저 공급업체가 특정 기능만 지원하므로 CSS3 사양의 요소가 다양한 속도로 발전할 수 있습니다. 그러나 서로 다른 브라우저는 서로 다른 시기에 서로 다른 기능을 지원하므로 크로스 브라우저 개발도 복잡해집니다.

CSS3 프로그래밍 도구는 CSS와 동일합니다. Windows의 메모장 및 메모장 또는 IntelliJ IDEA, Eclipse, MyEclipse와 같이 웹 페이지 텍스트를 편집하는 데 특별히 사용되는 기타 도구. , webstorm, sublime text 외에도 Emmet과 같은 프런트엔드 개발 전용 플러그인도 있습니다.

장점 평가

1. 개발 비용 및 유지 관리 비용 절감

CSS3이 등장하기 전에는 개발자가 둥근 모서리 효과를 얻기 위해 추가 HTML 태그를 추가하고 하나 이상의 이미지를 사용해야 하는 경우가 많았습니다. 태그는 CSS3의 border-radius 속성을 사용하여 수행할 수 있습니다. 이러한 방식으로 CSS3 기술은 사람들이 이미지를 그리고 자르고 최적화하는 작업에서 해방될 수 있게 해줍니다. 나중에 필렛의 곡률이나 색상을 조정해야 하는 경우 CSS2.1을 사용하여 이미지를 처음부터 그리고 잘라내야 이를 달성할 수 있습니다. CSS3를 사용하면 border-radius 속성 값만 수정하면 빠르게 완료됩니다. 수정.

CSS3에서 제공하는 애니메이션 기능을 사용하면 개발자는 일부 동적 버튼이나 동적 탐색을 구현할 때 JavaScript를 사용하지 않아도 됩니다. 따라서 개발자는 일부 동적 버튼이나 동적 탐색에 적응하기 위해 스크립트를 작성하거나 적합한 스크립트 플러그인을 찾는 데 많은 시간을 소비할 필요가 없습니다. 동적 웹사이트 효과.

2. 페이지 성능 향상

많은 CSS3 기술은 동일한 시각 효과를 제공하여 이미지를 "대체"합니다. 즉, 웹 개발을 할 때 중복되는 태그 중첩과 사용되는 이미지 수를 줄이는 것은 사용자에게 의미가 있습니다. 다운로드할 콘텐츠가 줄어들고 페이지가 더 빨리 로드됩니다. 또한 이미지, 스크립트 및 플래시 파일 수가 적으면 사용자가 웹 사이트를 방문할 때 HTTP 요청 수를 줄일 수 있으며 이는 페이지 로딩 속도를 향상시키는 가장 좋은 방법 중 하나입니다. CSS3를 사용하여 그래픽 웹 사이트를 만들면 이미지가 필요하지 않으므로 HTTP 요청 수가 크게 줄어들고 페이지 로딩 속도가 향상됩니다. 예를 들어 CSS3 애니메이션 효과는 JavaScript 및 Flash 파일에 대한 HTTP 요청을 줄일 수 있지만, 애니메이션 효과 렌더링을 완료하려면 브라우저에서 많은 작업을 수행해야 하므로 브라우저의 응답 속도가 느려지고 사용자 손실이 발생할 수 있습니다. . 따라서 복잡한 특수 효과를 사용할 때는 신중하게 생각해야 합니다. 실제로 많은 CSS3 기술은 어떤 상황에서도 페이지 성능을 크게 향상시킬 수 있습니다.

CSS3은 이전 버전과 완전히 호환되므로 계속 작동하기 위해 디자인을 수정할 필요가 없습니다. 웹 브라우저는 CSS2도 계속 지원할 예정입니다.

추천 학습: "css 동영상 튜토리얼"

위 내용은 CSS3 그게 무슨 뜻이야?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!