스타일(STYLE) 의 속성 및 속성값

카페 > 플래시,Flash,포토샵,P.. | 당신의여
http://cafe.naver.com/q69/8226

스타일(STYLE) 의 속성 및 속성값 jsss 사용하기 function 펑션명(){ document.all.idname.style.jsss속성명 = 속성값; } <p id=idname href="javascript:펑션명()">변경</a> 아래의 사이트를 참조 http://msdn.microsoft.com/library/default.asp?url=/workshop/author/css/reference/attributes.asp BACKROUND(배경) 속 성 명 속 성 값 내 용 css jsss background background background-color background-images background-repeat background-attachment background-position 웹문서의 배경을 정의하며 각각의 속성값을 "," 없이 두 개 이상 설정할수 있다. background-attachment backgroundAttachment scroll fixed 배경그림을 고정 또는 스크롤 background-color backgroundColor color_RGB color_NAME rgb(red,green,blue) transparent 배경 색상 및 배경색의 투명성 설정 background-image backgroundImage url(url) none 배경그림 설정 background-position backgroundPosition backgroundPositionX backgroundPositionY top left top center top right center left center center center right bottom left bottom center bottom right x% y% xpos ypos 배경그림의 위치를 설정하며 백분율을 표시할 때는 숫자와 %를 사용하고 절대위치는 숫자로 표시한다. background-repeat backgroundRepeat repeat repeat-x repeat-y no-repeat 배경그림이 화면보다 작을 경우 반복해서 보여줄지 여부를 설정

○

TEXT(글자) 속 성 명 속 성 값 내 용 css jsss color color color_RGB color_NAME rgb(red,green,blue) 글자 색을 설정 direction direction ltr rtl 글자를 표시하는 방향설정 letter-spacing letterSpacing normal lengthpx 글자 사이의 간격을 지정 하며 픽셀은 숫자 다음에 px로 표시 text-align textAlign left right center justify 글자의 정렬을 설정 text-decoration textDecoration none underline overline line-through blink 글자의 꾸밈 및 형식 설정 text-indent textIndent lengthpx % 좌측 여백을 백분율 또는 픽셀값으로 설정 text-transform textTransform none capitalize uppercase lowercase 글자의 대.소문자 변환 여부를 설정 word-spacing whiteSpace none lengthpx 단어 사이의 간격을 설정

○

FONT(글꼴) 속 성 명 속 성 값 내 용 css jsss font font font-style font-variant font-weight font-size line-height font-family caption icon menu 글꼴에 관련된 속성을 설정하며 line-height 값은 줄과 줄 사이의 간격을 백분율로 표시하고 각각의 요소 값은 콤마없이 두 개 이상 설정할 수 있다. font-family fontFamily family-name generic-family 글꼴이름을 설정 우선순위에 따라 두 개이상 콤마로 연결할수 있다. font-size fontSize xx-small x-small small medium large x-large xx-large smaller larger lengthpx % 글자 크기를 설정 font-style fontStyle normal italic 글자의 형태를 설정 font-variant fontVariant normal small-caps 글자의 크기를 설정 font-weight fontWeight normal bold bloder lighter 100 200 ..... 800 900 글자의 두께를 설정

○

BORDER(경계선) 속 성 명 속 성 값 내 용 css jsss border border border-width border-style border-color 경계선의 너비, 형식, 색을 설정 두 개이상 설정 가능 border-bottom borderBottom border-bottom-width border-style border-color 아래 경계선의 너비, 형식, 색을 설정 두 개이상 설정 가능 border-bottom-color borderBottomColor border-color 아래 경계선의 색을 설정 border-bottom-style borderBottomStyle none hidden dotted dashed solid double groove ridge inset outset 아래 경계선의 형식을 설정 border-bottom-width borderBottomWidth thin medium thick lengthpx 아래 경계선의 두께를 설정 border-color borderColor color 콤마없이 두 개이상의 값을 설정가능 border-left borderLeft border-left-width border-style border-color 왼쪽 경계선의 너비, 형식, 색을 지정 두 개이상의 값을 설정가능 border-left-color borderLeftColor border-color 왼쪽 경계선의 색을 설정 border-left-style borderLeftStyle border-style 왼쪽 경계선의 형식을 설정 border-left-width borderLeftWidth width 왼쪽 경계선의 두께를 설정 border-right borderRight border-right-width border-style border-color 오른쪽 경계선의 너비, 형식, 색을 지정 두 개이상의 값을 설정가능 border-right-color borderRightColor border-color 오른쪽 경계선의 색을 설정 border-right-style borderRightStyle border-style 오른쪽 경계선의 형식을 설정 border-right-width borderRightWidth width 오른쪽 경계선의 두께를 설정 border-style borderStyle style 경계선의 형식을 설정 border-top borderTop border-top-width border-style border-color 위쪽 경계선의 너비, 형식, 색을 지정 두 개이상의 값을 설정가능 border-top-color borderTopColor border-color 위쪽 경계선의 색을 설정 border-top-style borderTopStyle border-style 위쪽 경계선의 형식을 설정 border-top-width borderTopWidth width 위쪽 경계선의 두께를 설정 border-width borderWidth width 경계선의 두께를 설정

○

MARGIN(여백) 속 성 명 속 성 값 내 용 css jsss margin margin margin-top margin-right margin-bottom margin-left 여백의 속성을 설정 margin-bottom marginBottom auto lengthpx % 아래의 여백을 설정 margin-left marginLeft auto lengthpx % 왼쪽의 여백을 설정 margin-right marginRight auto lengthpx % 오른쪽의 여백을 설정 margin-top marginTop auto lengthpx % 위쪽의 여백을 설정

○

PADDING(경계선과 내용과의간격) 속 성 명 속 성 값 내 용 css jsss padding padding padding-top padding-right padding-bottom padding-left 상,하,좌,우의 경계선과 글자 사이의 간격을 설정 padding-bottom paddingBottom lengthpx % 아래 경계선과 글자 사이의 간격을 설정 padding-left paddingLeft lengthpx % 왼쪽 경계선과 글자 사이의 간격을 설정 padding-right paddingRight lengthpx % 오른쪽 경계선과 글자 사이의 간격을 설정 padding-top paddingTop lengthpx % 위쪽 경계선과 글자 사이의 간격을 설정

○

LIST(목록) 속 성 명 속 성 값 내 용 css jsss list-style list-style list-style-type list-style-position list-style-image 목록의 형식,위치,그림의 속성을 설정 list-style-image listStyleImage none url(url) 목록의 표시를 그림으로 설정 list-style-position listStylePosition inside outside 목록 항목의 위치를 설정 list-style-type listStyleType none disc circle square decimal decimal-leading-zero lower-roman lower-alpha upper-roman upper-alpha lower-greek lower-latin upper-latin hebrew armenian georgian cjk-ideographic hiragana katakana hiragana-iroha katakana-iroha 목록의 항목 표시자의 속성을 설정

○

DIMENSION(영역) 속 성 명 속 성 값 내 용 css jsss height height auto legthpx % 영역의 높이를 설정 line-height lineHeight auto legthpx % 영역의 줄 간격을 설정 width width auto legthpx % 영역의 너비를 설정

○

CLASSIFICATION(식별) 속 성 명 속 성 값 내 용 css jsss cursor cursor url auto crosshair default pointer move e-resize ne-resize nw-resize n-resize se-resize sw-resize s-resize w-resize text wait help 커서의 모양을 설정 float float left right none 해당요소를 상위 요소안에서 좌.우로 이동할 것인가를 설정 position position static relative absolute 화면에 표시할 위치를 설정 visibility visibility visible hidden 화면에 표시 여부를 설정

○

POSITION(위치) 속 성 명 속 성 값 내 용 css jsss bottom bottom auto legthpx % 상위의 요소 아래 경계선에서 떨어진 간격을 설정 clip clip rect(top,right,bottom,left) auto