RGBA
background:rgba(0, 118, 160, .25);
처음 세 값은 RGB 색상 값이고 마지막 값은 투명도 수준(0 = 투명, 1 = 불투명)입니다.
RBGA는 글꼴 색상, 테두리 색상, 배경색, 그림자 색상 등 모든 색상 관련 속성에 적용할 수 있습니다.
텍스트 그림자 text-shadow (브라우저 판단 필요 없음)
text-shadow:2px 3px 2px #000;
text-shadow의 구조는 X - 오프셋, Y - 오프셋, 흐림, 색상의 순서로 되어 있습니다. 🎜 >
text-shadow:-2px -3px 2px rgba(0, 118, 160, .25);
text-shadow:0px 1px 0px #fff,0px -1px 0px #000;
Box-shadow box-shadow (브라우저 판단 필요) box-shadow 구조는 위와 같습니다. 텍스트 그림자: 각각 X - 오프셋, Y 오프셋, 흐림 및 색상으로 표시됩니다.
-webkit-box-shadow:5px 5px 7px #333; -moz-box-shadow:5px 5px 7ix #333;
moz-box-shadow: -2px -2px 0 #fff, 2px 2px 0 #bb9595, 2px 4px 15px rgba(0, 0, 0, .3);
그림자 색상: 이 매개변수는 선택 사항입니다. 색상이 설정되지 않은 경우 브라우저는 기본 색상을 사용하지만 각 브라우저의 기본 색상은 다릅니다. 특히 웹킷 커널 아래의 Safari 및 Chrome 브라우저는 무색입니다. 즉, 이 매개변수를 생략하지 않는 것이 좋습니다. .
Box border radius border-radius (브라우저를 결정해야 함) border radius의 약어는
Padding<과 유사합니다. 🎜 > 및 여백 속성(예: 테두리 반경: 20픽셀) 브라우저 순서대로 테두리 반경을 렌더링하려면 WebKit 브라우저에서는 "-WebKit-"를 사용하고 Firefox에서는 "-moz-"를 사용합니다.
border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px;
각 모서리마다 다른 값을 지정할 수 있습니다. Firefox와 Webkit Angular는 속성 이름이 다릅니다.
“Webkit” 작성법
-webkit-border-top-left-radius:5px; -webkit-border-top-right-radius:15px; -webkit-border-bottom-left-radius:25px; -webkit-border-right-left-radius:45px;
“Firefox” 작성법
-moz-border-radius-topleft:5px; -moz-border-radius-topright:15px; -moz-border-radius-bottomleft:25px; -moz-border-radius-bottomright:45px;
위 내용은 CSS3의 공통 속성 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!