JavaScript 및 CSS 스타일 속성 비교표

특정 특수 효과를 얻으려면 Javascript를 사용하여 특정 태그의 CSS 속성을 동적으로 변경해야 합니다.

예를 들어 마우스가 이미지 위로 지나갈 때 이미지에 테두리를 추가합니다.

JavaScript 코드
[javascript] view plaincopyprint? 🎜>

[javascript ] view plaincopyprint?





JavaScript에서 스타일 다음의 속성은 무엇입니까?

JavaScript CSS 스타일 속성 비교표

상자 태그 및 속성 비교

CSS 구문(대소문자 구분) JavaScript 구문(대소문자 구분)

테두리 테두리
border-bottom borderBottom
border-bottom-color borderBottomColor
border-bottom-style borderBottomStyle
border-bottom-width borderBottomWidth
border-color borderColor
border-left borderLeft
border -왼쪽 색상 테두리LeftColor
테두리 왼쪽 스타일 테두리LeftStyle
테두리 왼쪽 너비 테두리LeftWidth
테두리 오른쪽 테두리Right
테두리 오른쪽 색상 borderRightColor
테두리 오른쪽 스타일 테두리RightStyle
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
clearclear
float floatStyle
margin margin
margin-bottom marginBottom
margin-left marginLeft
margin-right marginRight
margin-top marginTop
padding padding
padding-bottom paddingBottom
padding-left paddingLeft
padding-right paddingRight
padding-top paddingTop


색상 및 배경 레이블과 속성 비교

CSS 구문(대소문자 구분) JavaScript 구문(대소문자 구분)

배경 배경
배경 첨부 backgroundAttachment
배경 색상 배경색상
배경 이미지 배경 이미지
배경 위치 배경 위치
background-repeat backgroundRepeat
색상 색상


스타일 태그 및 속성 비교

CSS 구문(대소문자 구분) JavaScript 구문(대소문자 구분)

표시 표시
list- 스타일 유형 목록StyleType
목록 스타일 이미지 목록StyleImage
목록 스타일 위치 목록StylePosition
목록 스타일 목록스타일
공백 공백


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

CSS 구문(대소문자 구분) JavaScript 구문(대소문자 구분)

글꼴 글꼴
글꼴 계열 글꼴Family
글꼴 크기 글꼴 크기
글꼴 스타일 글꼴 스타일
글꼴 변형 FontVariant
글꼴 가중치 FontWeight


텍스트 레이블 및 속성 비교

CSS 구문(대소문자 구분) JavaScript 구문(대소문자 구분)

letter-spacing letterSpacing
line -break lineBreak
줄 높이 lineHeight
텍스트 정렬 textAlign
텍스트 장식 textDecoration
text-indent textIndent
text-justify textJustify
text-transform textTransform
vertical- 수직 정렬