검색 이펙트

CSS 속성 검색하기

indexOf() / search()

검색하기

CSS 속성 갯수 : 0개

align-content : 콘텐츠 아이템의 상하관계 정렬 상태를 설정합니다.
align-items : 콘텐츠 아이템의 내부 상하관계 정렬 상태를 설정합니다.
align-self : 개별적인 콘텐츠 아이템의 정렬 상태를 설정합니다.
all : 요소의 속성을 초기화 또는 상속을 설정합니다.
animation : 애니메이션과 관련된 속성을 일괄적으로 설정합니다.
animation-delay : 애니메이션 지연 시간을 설정합니다.
animation-direction : 애니메이션 움직임 방향을 설정합니다.
animation-duration : 애니메이션 움직임 시간을 설정합니다.
animation-fill-mode : 애니메이션이 끝난 후의 상태를 설정합니다.
animation-iteration-count : 애니메이션 반복 횟수 설정합니다.
animation-name : 애니메이션 keyframe 이름을 설정합니다.
animation-play-state : 애니메이션 진행상태를 설정합니다.
animation-timing-function : 애니메이션 움직임의 속도를 설정합니다.
backdrop-filter : 배경에 그래픽 효과를 설정합니다.
backface-visibility : 요소의 뒷면을 설정합니다.
background-attachment : 배경 이미지의 고정 여부를 설정합니다.
background-blend-mode : 배경을 혼합했을 때의 상태를 설정합니다.
background-clip : 백그라운드 이미지의 위치 기준점을 설정하기 위한 속성입니다.
background-color : 백그라운드 색을 설정합니다.
background-image : 백그라운드 이미지 및 배경 속성을 설정합니다.
background-origin : 백그라운드 이미지의 위치 기준점을 설정하기 위한 속성입니다.
background-position : 백그라운드 이미지의 위치 영역을 설정합니다.
background-repeat : 백그라운드 이미지 반복 여부를 설정합니다.
background-size : 백그라운드 이미지 사이즈를 설정합니다.
background : 백그라운드 속성을 일괄적으로 설정합니다.
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-decoration-break : 컬럼 및 줄바꿈시 테두리와 패딩의 방식을 설정합니다.
box-shadow : 박스 요소의 그림자를 설정합니다.
box-sizing : 요소 크기에 패딩 포함 여부를 설정합니다.
bottom : 요소의 하단 여백(margin)을 설정합니다. 값을 지정하면 해당 값만큼 하단으로 내려갑니다.
box-decoration-break : 상자(box)의 장식 요소(decorations)가 여러 줄로 나뉘어져 있을 경우 어떻게 처리할지 설정합니다.
box-shadow : 상자의 그림자를 설정합니다.
box-sizing : 상자의 크기를 어떻게 계산할지 설정합니다.
caption-side : 표(caption)의 위치를 설정합니다. top(기본값)은 표 상단에 위치시키고, bottom은 표 하단에 위치시킵니다.
caret-color : 입력 커서(caret)의 색상을 설정합니다.
clear : 요소의 좌우 혹은 상하측에 다른 요소가 위치할 경우 어떻게 처리할지 설정합니다.
clip : 요소의 크기를 설정하고, 초과하는 부분을 잘라내거나 숨길 때 사용합니다.
color : 텍스트(text)의 색상을 설정합니다.
column-count : 다단(multi-column) 레이아웃을 적용할 때, 컨테이너(container) 안에서 표시할 열(column)의 개수를 지정합니다.
column-fill : 다단 레이아웃에서 마지막 열의 높이를 어떻게 조정할지 설정합니다.
column-gap : 다단(multi-column) 레이아웃에서 열(column) 사이의 간격을 설정합니다.
column-rule : 다단 레이아웃에서 열(column)과 열 사이에 그려질 선을 설정합니다.
column-rule-color : 다단 레이아웃에서 열(column)과 열 사이의 선의 색상을 설정합니다.
column-rule-style : 다단 레이아웃에서 열(column)과 열 사이의 선의 스타일을 설정합니다.
column-rule-width : 다단 레이아웃에서 열(column)과 열 사이의 선의 두께를 설정합니다.
column-span : 다단 레이아웃에서 열(column)이 다른 열에 걸쳐서 표시될 때, 해당 열이 몇 개의 열에 걸쳐서 표시될지 설정합니다.
column-width : 다단 레이아웃에서 열(column)의 폭을 설정합니다.
columns : 다단 레이아웃에서 컨테이너(container) 안에 표시할 열(column)의 개수와 폭을 한 번에 설정하는 단축 속성입니다.
content : 요소의 콘텐츠(content)를 설정하거나 가상 요소(pseudo-element)에서 콘텐츠를 생성할 때 사용합니다.
counter-increment : 요소의 카운터(counter) 값을 증가시키는데 사용됩니다.
counter-reset : 요소의 카운터 값을 초기화하는데 사용됩니다.
cursor : 마우스 커서(cursor) 모양을 설정합니다.
direction : 텍스트 방향을 설정합니다. ltr(기본값)은 왼쪽에서 오른쪽으로 텍스트가 흐르며, rtl은 오른쪽에서 왼쪽으로 텍스트가 흐릅니다.
display : 요소의 표시(display) 방식을 설정합니다. none은 요소를 화면에 표시하지 않습니다. block은 요소를 블록(block) 요소로 표시하며, inline은 요소를 인라인(inline) 요소로 표시합니다.
empty-cells : 표의 빈 셀(empty cell) 표시 여부를 설정합니다.
filter : 요소에 필터(filter) 효과를 적용합니다.
flex : 요소에 유연한(flexible) 박스 모델을 적용합니다.
flex-basis : 유연한 박스 모델에서 초기 크기를 설정합니다.
flex-direction : 유연한 박스 모델에서 아이템(item)의 배치 방향을 설정합니다.
flex-flow : 유연한 박스 모델에서 flex-direction과 flex-wrap을 함께 설정하는 축약형입니다.
flex-grow : 유연한 박스 모델에서 아이템의 증가(flex) 비율을 설정합니다.
flex-shrink : 유연한 박스 모델에서 아이템의 축소(shrink) 비율을 설정합니다.
flex-wrap : 유연한 박스 모델에서 아이템을 여러 줄로 나눌지, 한 줄에 배치할지 설정합니다.
float : 요소를 좌측 혹은 우측으로 띄워서 배치합니다. 이 속성을 사용하면 다른 요소들이 float된 요소 주위를 감쌀 수 있게 됩니다.
font : 텍스트의 글꼴(font)과 스타일(style)을 설정합니다.
font-family : font-family 속성은 폰트 종류를 설정합니다.
font-size : font-size 속성은 폰트 사이즈 속성을 설정합니다.
font-size-adjust : font-size-adjust 속성은 소문자를 기준으로 폰트 크기를 설정합니다.
font-stretch :
font-style : font-style 속성은 폰트의 스타일을 설정합니다.
font-variant : font-variant 속성은 글꼴 변형 형태를 일괄적으로 설정합니다.
font-variant-numeric :font-variant-numeric 속성은 숫자에 대한 글꼴 글리프(표시 형태)를 설정합니다.
font-variant-emoji : font-variant-emoji 속성은 이모지 글꼴 글리프를 설정합니다.
font-variant-east-asian : font-variant-east-asian 속성은 아시아 언어 글꼴 글리프를 설정합니다.
font-variant-caps : font-variant-caps 속성은 소문자/대문자에 대한 글꼴 글리프를 설정합니다.
font-variant-alternates : font-variant-alternates 속성은 글꼴 글리프의 대체 형태를 설정합니다.
font-variant-position : font-variant-position 속성은 글꼴 글리프의 위치를 설정합니다.
font-variation-settings : font-variation-settings 속성은 가변 폰트를 설정합니다.
font-weight : font-weight 속성은 폰트의 두께를 설정합니다.
grid : grid container를 정의하고, 그 안에서 grid items을 배치합니다.
grid-areat : grid item의 위치와 크기를 지정합니다.
grid-auto-columns : 명시되지 않은 경우 자동으로 생성되는 grid columns의 크기를 정의합니다.
grid-auto-flow : grid items가 자동 배치될 때 배치 방향을 정의합니다.
grid-auto-rows : 명시되지 않은 경우 자동으로 생성되는 grid rows의 크기를 정의합니다.
grid-column : grid item이 차지할 grid column의 시작과 끝 위치를 지정합니다.
grid-column-end : grid item이 차지할 grid column의 끝 위치를 지정합니다.
grid-column-gap : grid column 사이의 간격을 지정합니다.
grid-column-start : grid item이 차지할 grid column의 시작 위치를 지정합니다.
grid-gap : grid row와 column 사이의 간격을 지정합니다.
grid-row : grid item이 차지할 grid row의 시작과 끝 위치를 지정합니다.
grid-row-end : grid item이 차지할 grid row의 끝 위치를 지정합니다.
grid-row-start : grid item이 차지할 grid row의 시작 위치를 지정합니다.
grid-template : grid의 전체 크기와 구조를 지정합니다.
grid-template-areas : grid 영역을 지정하고, 영역에 이름을 부여합니다.
grid-template-columns : grid columns의 개수와 크기를 지정합니다.
grid-template-rows : grid rows의 개수와 크기를 지정합니다.
hanging-punctuation :문단의 처음이나 끝에서 특정 문자의 위치를 변경하여 텍스트를 더 잘 읽을 수 있게 하는 속성입니다.
height :요소의 세로 크기를 설정합니다.
hyphens :텍스트 줄바꿈 할때 하이픈으로 연결하는 방법을 설정합니다.
isolation : 요소를 다른 콘텐츠와 격리시켜, 배경이나 경계선 등을 다른 요소에 영향받지 않게 하는 속성입니다.
isolation : 요소를 다른 콘텐츠와 격리시켜, 배경이나 경계선 등을 다른 요소에 영향받지 않게 하는 속성입니다.
justify-content : flexbox나 grid 레이아웃에서 요소를 가로 방향으로 정렬하는 방법을 지정하는 속성입니다.
left : 요소의 위치를 왼쪽에서부터 지정하는 속성입니다.
letter-spacing : 문자 사이의 간격을 조절하는 속성입니다.
line-height : 텍스트 줄 간격을 조절하는 속성입니다.
list-style : 리스트 스타일을 지정하는 단축 속성입니다.
list-style-image : 리스트 아이템 마커에 이미지를 적용하는 속성입니다.
list-style-position : 리스트 아이템 마커의 위치를 지정하는 속성입니다.
list-style-type : 리스트 아이템 마커의 종류를 지정하는 속성입니다.
margin : 모든 margin 속성을 이용한 스타일을 한 줄에 설정할 수 있습니다.
margin-bottom : 아래쪽의 마진(margin) 값을 설정합니다.
margin-left : 왼쪽의 마진(margin) 값을 설정합니다.
margin-right : 오른쪽의 마진(margin) 값을 설정합니다.
margin-top : 윗쪽의 마진(margin) 값을 설정합니다.
margin-height : 요소의 높이와 여백을 각각 설정하거나, 요소의 높이를 조정하는 데 여백을 사용합니다.
margin-width : 요소의 너비와 여백을 각각 설정하거나, 요소의 너비를 조정하는 데 여백을 사용합니다.
min-height : 요소의 최소 세로 크기를 설정합니다.
min-width : 요소의 최소 가로 크기를 설정합니다.
mix-blend-mode : 두 개 이상의 요소가 겹쳐질 때, 그들의 블렌딩(혼합) 모드를 설정하는 데 사용됩니다.
object-fit : 이미지나 동영상과 같은 요소가 해당 요소의 컨테이너 안에서 어떻게 표시될지를 지정합니다.
object-position : 이미지나 비디오 등의 요소가 포함된 요소 내에서의 위치를 지정할 때 사용됩니다.
opacity : 요소의 투명도를 지정할 때 사용됩니다.
order : Flexbox나 Grid Layout 등의 레이아웃 방식에서 사용됩니다.
outline : 요소의 외곽선을 지정하는 데 사용됩니다. "outline" 속성은 요소의 경계와 다르게, 요소 외곽에 그려집니다.
outline-color : 요소의 외곽선 색상을 지정하는 데 사용됩니다.
outline-offset : "outline" 속성으로 지정한 외곽선과 요소의 경계 사이의 거리를 조절하는 데 사용됩니다.
outline-style : "outline" 속성으로 지정한 외곽선의 스타일을 지정하는 데 사용됩니다.
outline-width : "outline" 속성으로 지정한 외곽선의 너비를 지정하는 데 사용됩니다.
overflow : 요소의 내용이 자신의 경계를 벗어나는 경우 어떻게 처리할지를 지정하는 데 사용됩니다.
overflow-x : 요소의 가로 방향 오버플로우(overflow) 처리를 지정하는 데 사용됩니다.
overflow-y : 요소의 세로 방향 오버플로우(overflow) 처리를 지정하는 데 사용됩니다.
overflow-wrap : 요소의 텍스트가 너무 길어서 요소의 경계를 벗어나는 경우 어떻게 처리할지를 지정하는 데 사용됩니다.
padding : 요소 내부의 콘텐츠와 경계선 사이의 간격을 지정하는 단축 속성입니다.
padding-bottom : 요소 내부의 하단 경계와 콘텐츠 사이의 간격을 지정하는 속성입니다.
padding-left : 요소 내부의 왼쪽 경계와 콘텐츠 사이의 간격을 지정하는 속성입니다.
padding-right : 요소 내부의 오른쪽 경계와 콘텐츠 사이의 간격을 지정하는 속성입니다.
padding-top : 요소 내부의 상단 경계와 콘텐츠 사이의 간격을 지정하는 속성입니다.
page-break-after : 요소 뒤에 페이지 나누기를 적용하는 속성입니다.
page-break-before : 요소 앞에 페이지 나누기를 적용하는 속성입니다.
page-break-inside : 요소 내부에 페이지 나누기를 적용하는 속성입니다.
perspective : 3D 변환 요소의 원근 거리를 설정하는 속성입니다.
perspective-origin : 3D 변환 요소의 원근 거리를 설정하는 위치를 지정하는 속성입니다.
pointer-events : 요소가 마우스 이벤트를 수신할 수 있는지 여부를 지정하는 속성입니다.
position : 요소의 위치를 지정하는 속성입니다. static, relative, absolute, fixed, sticky 등의 값이 있습니다.
quotes : 인용 부호의 모양을 지정하는 속성입니다.
resize : 요소의 크기 조정 여부를 지정하는 속성입니다. none, both, horizontal, vertical 등의 값이 있습니다.
right : 요소 내부의 오른쪽 경계와 부모 요소 사이의 간격을 지정하는 속성입니다.
tab-size : 탭 문자의 크기를 지정하는 속성입니다.
table-layout : 테이블 요소의 셀 너비 및 자동 레이아웃 알고리즘을 지정하는 속성입니다. auto, fixed 등의 값이 있습니다.
text-align : text-align 속성은 텍스트 정렬 방식을 설정합니다.
text-align-last : text-align-last 속성은 문단의 마지막 텍스트 정렬 방식을 설정합니다.
text-decoration : text-decoration 속성은 텍스트 라인 속성을 일괄적으로 설정합니다.
text-decoration-color : text-decoration-color 속성은 글자 라인의 색상 속성을 설정합니다.
text-decoration-line : text-decoration-line 속성은 글자 라인의 위치 속성을 설정합니다.
text-decoration-style : 꾸밈에 사용되는 선의 스타일을 지정하는 속성입니다.
text-decoration-skip-ink : text-decoration-skip-ink 속성은 언더 라인의 글씨 겹침을 설정합니다.
text-decoration-thickness : text-decoration-thickness 속성은 글자 라인의 굵기 속성을 설정합니다.
text-emphasis-color : text-emphasis-color 속성은 텍스트에 강조 표시 색상을 설정합니다.
text-emphasis-position : text-emphasis-position 속성은 텍스트에 강조 표시 위치를 설정합니다.
text-emphasis-style : text-emphasis-style 속성은 텍스트에 강조 표시 스타일을 설정합니다.
text-emphasis : text-emphasis 속성은 텍스트에 강조 표시를 일괄적으로 설정합니다.
text-indent : text-indent 속성은 문단 들여쓰기 속성을 설정합니다.
text-justify : text-justify 속성은 양쪽 정렬을 했을 때 정렬 유형을 설정합니다.
text-overflow : text-overflow 속성은 텍스트가 영역을 벗어 났을 때 속성을 설정합니다.
text-shadow : text-shadow 속성은 텍스트 그림자를 설정합니다.
text-transform : 대문자 또는 소문자로 바꾸는 속성입니다.
text-underline-offset : text-underline-offset 속성은 언더 라인의 오프셋 값을 설정합니다.
text-underline-position : 언더 라인의 위치를 설정합니다.
top : 요소의 위치를 위쪽으로부터 지정합니다.
transform :요소의 변형(transform)을 지정합니다.
transform-origin : 요소의 변형 기준점(origin)을 지정합니다.
transform-style : 3D 변형(transform)을 사용할 때 하위 요소에 적용할 방법을 지정합니다.
transition : 요소에 특정한 변화(transition) 효과를 적용합니다.
transition-delay : 트랜지션의 시작 시점을 지연시킵니다. 지정한 시간(ms)이 지난 후에 트랜지션이 시작됩니다.
transition-duration : 트랜지션의 지속 시간을 설정합니다. 지정한 시간(ms) 동안 트랜지션 효과가 적용됩니다.
transition-property : 트랜지션을 적용할 CSS 속성을 지정합니다. 여러 개의 속성을 쉼표로 구분하여 지정할 수 있습니다.
transition-timing-function : 속성을 서서히 변화시키는 속성입니다.
unicode-bidi : 텍스트의 양방향 흐름을 지정하는 속성입니다. normal, embed, isolate, bidi-override 등의 값이 있습니다.
user-select : 사용자가 요소 내의 텍스트를 선택할 수 있는지 여부를 지정하는 속성입니다. auto, none, text, contain, all 등의 값이 있습니다.
vertical-align : 요소 내부의 인라인 요소의 수직 정렬을 지정하는 속성입니다. baseline, top, middle, bottom, sub, super, text-top, text-bottom 등의 값이 있습니다.
visibility : 요소의 가시성 여부를 지정하는 속성입니다. visible, hidden, collapse 등의 값이 있습니다.
word-spacing : 단어 사이의 간격을 지정하는 속성입니다.
word-wrap : 긴 단어의 줄바꿈을 처리하는 방법을 지정하는 속성입니다. normal, break-word, anywhere 등의 값이 있습니다.
z-index : 요소의 Z축 위치를 지정하는 속성입니다. 더 큰 숫자가 더 높은 위치에 있습니다.

자바스크립트

CSS 속성 검색하기

indexOf() / search()