CSS3에 추가된 새로운 속성

CSS3의 새로운 속성은 다음과 같습니다: 1. 텍스트 그림자 2. 배경 그라데이션 4. 요소 회전 6. 글꼴 변경 등

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

오늘은 참고할만한 가치가 있는 CSS3의 새로운 속성을 소개하겠습니다. 모든 분들께 도움이 되었으면 좋겠습니다.

CSS3 최신 버전의 등장 모든 브라우저가 지원하는 것은 아니지만 웹 디자인을 더욱 쉽게 만듭니다. 그러나 기술의 급속한 변화와 CSS3의 모듈화로 인해 현재 모든 브라우저는 CSS3를 완벽하게 지원하고 있습니다. CSS3와 HTML5가 가까운 미래에 인터넷의 미래가 될 것이라고 믿습니다. 기사.

의 새로운 기능 브라우저 호환성 문제:

Firefox에는 접두사 -moz-가 필요합니다.

Chrome 및 Safari에는 접두사 -webkit-이 필요합니다.

【추천 강좌: CSS3 튜토리얼】#🎜🎜 #

CSS3 텍스트 섀도우

<div style="text-shadow: 5px 5px 5px #444;">这是一行文字</div>

CSS3 배경 그라데이션 효과# 🎜🎜#CSS3의 선형 그라데이션 속성은 지금까지 Safari 4와 Chrome 및 Firefox 3.6에서만 지원됩니다.

<div style="width:200px;height:100px;
background-color: #1a82f7;
background-repeat: repeat-x;
background: -webkit-linear-gradient(top, #2F2727, #1a82f7); "></div>

CSS3 색상 효과

이제 불투명도가 적용됩니다#🎜 🎜 #

rgb는 CSS에서 요소의 색상을 설정하는 데 사용되지만 CSS3에는 색상 불투명도를 설정할 수 있는 새로운 작업이 있습니다. RGB는 요소의 불투명도를 제어하는 ​​방법을 단순화합니다. ####rreee########### ## ## ## ####css3 transform (요소 회전)#🎜🎜 ## 🎜🎜 ## 🎜🎜 #CSS3에는 요소를 회전시키는 변환 속성이 ​​새로 도입되었습니다

<div style="width:50px;height:50px;background-color:rgba(123,123,123,0.4);"></div>

CSS3 다중 열 레이아웃# 🎜 🎜#

웹 레이아웃에서는 각 웹 페이지를 열로 나누고 다양한 브라우저에 맞게 조정해야 합니다. CSS3에서 사용되는 다중 열 레이아웃 속성은 필요한 열 수만 지정하면 됩니다. 그런 다음 만들기 column-count 속성은 요소를 구분해야 하는 열 수를 지정합니다.

<div style="width:50px;height:50px;background-color: pink;-webkit-transform:rotate(40deg); ">旋转</div>

#🎜 🎜##🎜 🎜#CSS3 웹 글꼴

CSS3은 웹 페이지에 사용자 정의 글꼴을 포함할 수도 있습니다. 원래 글꼴은 클라이언트 시스템에 따라 다르며 웹 페이지만 가능합니다. 컴퓨터에서 지원하는 글꼴이지만 @font-face 속성을 사용하면 다른 곳에서도 글꼴을 사용할 수 있습니다. 전체 내용이 포함되어 있어 모든 사람이 CSS3의 새로운 속성을 이해하는 데 도움이 되기를 바랍니다.

위 내용은 CSS3에 추가된 새로운 속성의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!