CSS 속성과 JavaScript 인코딩 방법 비교표

CSS와 JS는 긴밀하게 협력하여 페이지에 독특한 효과를 많이 추가합니다. 특별한 효과를 얻으려면 Javascript를 사용하여 특정 태그의 CSS 속성을 동적으로 변경해야 합니다. 예를 들어, 마우스가 이미지 위로 지나갈 때 이미지에 테두리를 추가합니다. 코드는 다음과 같습니다. JavaScript에서 스타일 다음의 속성은 무엇입니까?

function imageOver(e) { e.style.border="1px solid red" } } function imageOut(e) { e.style.borderWidth=0; )" onmouseout="imageOut(this)" />

JavaScript CSS 스타일 속성 비교표

박스 라벨 및 속성 비교

CSS语법(不区分大小写) JavaScript语법(区分大小写) border 테두리 border-bottom borderBottom border-bottom-color borderBottomColor border-bottom-style borderBottomStyle border-bottom-width borderBottomWidth border-color borderColor border-left borderLeft border-left-color borderLeftColor border-left-style borderLeftStyle border-left-width borderLeftWidth border-right borderRight border-right-color borderRightColor border-right-style borderRightStyle border-right-width borderRightWidth border-style borderStyle border-top borderTop border -top-color borderTopColor border-top-style borderTopStyle border-top-width borderTopWidth border-width borderWidth 클리어 클리어 플로트 여백 여백- 하단 마진 봇 마진-왼쪽 마진 프트 마진 오른쪽 여백 마진-탑 Margintop 패딩 패딩 패딩-바닥 패딩 보도 패딩-왼쪽 패딩 플로트 패딩-라이트 패딩 적 패딩탑 패딩탑

颜color和背景标签和属性对조

CSS 구문(대소문자 구분) JavaScript 구문(대소문자 구분) 배경 배경 배경 첨부 backgroundAttachment 배경색 backgroundColor backgroundImage 배경 위치 backgroundPosition 배경 반복 backgroundRepeat 색상 색상

스타일 태그 및 속성 비교

CSS 구문(대소문자 구분) listStyle white-space whiteSpace

텍스트 스타일 태그 및 속성 비교

CSS 구문(대소문자 구분) JavaScript 구문(대소문자 구분) ly font-size 스타일 글꼴스타일 글꼴 변형 글꼴 변형

글꼴 가중치 글꼴 가중치

속성 비교 CSS 구문(대소문자 구분) JavaScript 구문(대소문자 구분) 문자 간격 부 in in on textAlign 텍스트 장식 textDecoration text-indent textIndent text-justify textJustify text-transform textTransform

vertical-align VerticalAlign