Latest web development tutorials
×

CSS 참조 설명서

CSS 참조 설명서 CSS 선택자 CSS 음성 참조 CSS Web 안전 글꼴 CSS 생기 CSS 단위 CSS 색 CSS 법률 색상 값 CSS 색 이름 CSS 16 진수 색상 값 CSS 브라우저 지원

CSS 재산

align-content align-items align-self all animation animation-delay animation-direction animation-duration animation-fill-mode animation-iteration-count animation-name animation-play-state animation-timing-function appearance backface-visibility background background-attachment background-blend-mode background-clip background-color background-image background-origin background-position background-repeat background-size border border-bottom border-bottom-color border-bottom-left-radius border-bottom-right-radius border-bottom-style border-bottom-width border-collapse border-color border-image border-image-outset border-image-repeat border-image-slice border-image-source border-image-width border-left border-left-color border-left-style border-left-width border-radius border-right border-right-color border-right-style border-right-width border-spacing border-style border-top border-top-color border-top-left-radius border-top-right-radius border-top-style border-top-width border-width bottom box-align box-direction box-flex box-flex-group box-lines box-ordinal-group box-orient box-pack box-shadow box-sizing caption-side clear clip color column-count column-fill column-gap column-rule column-rule-color column-rule-style column-rule-width column-span column-width columns content counter-increment counter-reset cursor direction display empty-cells filter flex flex-basis flex-direction flex-flow flex-grow flex-shrink flex-wrap float font @font-face font-family font-size font-size-adjust font-stretch font-style font-variant font-weight grid-columns grid-rows hanging-punctuation height icon justify-content @keyframes left letter-spacing line-height list-style list-style-image list-style-position list-style-type margin margin-bottom margin-left margin-right margin-top max-height max-width @media min-height min-width nav-down nav-index nav-left nav-right nav-up opacity order outline outline-color outline-offset outline-style outline-width overflow overflow-x overflow-y padding padding-bottom padding-left padding-right padding-top page-break-after page-break-before page-break-inside perspective perspective-origin position punctuation-trim quotes resize right rotation tab-size table-layout target target-name target-new target-position text-align text-align-last text-decoration text-decoration-color text-decoration-line text-decoration-style text-indent text-justify text-outline text-overflow text-shadow text-transform text-wrap top transform transform-origin transform-style transition transition-delay transition-duration transition-property transition-timing-function unicode-bidi vertical-align visibility white-space width word-break word-spacing word-wrap z-index

CSS 부

CSS는 길이를 나타내는 데 사용되는 여러 장치를 가지고있다.

일부 속성은 그래서 CSS 길이 폭, 마진, 패딩, 글꼴 크기, 테두리 폭을 설정하고있다.

길이와 등등 10px, 2EM와 같은 디지털 장치.

숫자와 단위 사이에 공백을 가질 수 없습니다. 길이가 0 인 경우, 장치는 생략 될 수있다.

일부 CSS 속성의 경우, 길이는 음수가 될 수 있습니다.

상대 및 절대 : 단위 길이의 두 종류가있다.


브라우저 지원

다음 표는 길이의 단위를 지원하는 브라우저의 최소 버전을 표시.

단위 길이
그들, 전, %, 픽셀, cm, mm,에, 태평양 표준시, PC를 1.0 3.0 1.0 1.0 3.5
채널 27.0 9.0 1.0 7.0 20.0
4.0 9.0 3.6 4.1 11.6
VH, 폭스 바겐 20.0 9.0 19.0 6.0 20.0
VMIN 20.0 9.0 * 19.0 6.0 20.0
VMAX 26.0 지원하지 않습니다 19.0 지원하지 않습니다 20.0

참고 : 표준이 아닌 이름 VM 지원 VMIN으로 인터넷 익스플로러 9.


상대 길이

상대 길이 단위는 다른 사람의 재산의 길이 길이 상대적으로 지정합니다. 상대 길이 더 적합한 장치에 따라.

단위 기술 온라인 예
그들 이것은 현재의 구성 요소의 폰트 사이즈의인가에 대하여 설명한다, 또한 상대적 길이 단위이다. 일반적으로 브라우저의 기본 글꼴 크기는, 16px입니다 2EM == 32px; 시험
전의 영어 그림은 작은 x의 높이에 따라 달라집니다 시험
채널 숫자 0의 폭
루트 요소 (HTML) 글꼴 크기
폭스 바겐 관점 폭, 윈도우 폭, 윈도우의 폭 1vw = 1 % 시험
VH 관점 높이, 창 높이, 1vh = 1 %의 창 높이 시험
VMIN 폭스 바겐 작은 VH 하나. 시험
VMAX 폭스 바겐 큰 VH 하나. 시험
%

주의팁 : REM 수면 그들과 무슨 차이점은 무엇입니까?것을 제외 소자 REM은 폰트 크기가 여전히 상대적 크기하지만 정반대 HTML 루트 요소 세트.

절대 길이

절대 길이 단위는 실제 물리적 인 크기를 반영하고, 고정 된 값이다. 절대 길이 단위는 그것이있는 환경 (모니터, 해상도, 운영 시스템 등)에 의존하지 않고 출력 매체에 크게 의존한다.

단위 기술 온라인 예
cm CM 시험
mm 밀리미터 시험
인치 (1 인치 = 96px = 2.54) 시험
픽셀 * 픽셀 (1 픽셀 1 인치의 = 1 / 96) 시험
태평양 표준시 점, 약 1/72 인치 (에 1pt = 1 / 72in) 시험
PC를 파이 카, 6pt, 1/6 Yingcun에 대한 (1 개 = 12 PT) 시험

아마도 픽셀은 최고 "장치 픽셀"이 픽셀 길이로 간주하고는 관련이없는 디스플레이 스크린 픽셀의 텍스트를 볼 수있다. PX 실제로 각 유닛의 척도이다.