검색 이펙트

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 : 요소 크기에 패딩 포함 여부를 설정합니다.
caption-side :표(caption) 요소의 캡션(caption) 위치를 지정합니다
caret-color : 텍스트 입력 컨트롤 내에서 캐럿(caret) 색상을 지정합니다.
clear : 요소의 좌우/상하측 형제 요소(float이나 inline-block 요소)와의 관계를 지정합니다.
clip : 요소의 보이는 부분을 클리핑(clipping)합니다.
color : 요소의 텍스트 색상을 지정합니다.
column-count : 다단 컨텐츠(multi-column content)를 사용할 때 열(column)의 개수를 지정합니다
column-fill : 다단 컨텐츠의 마지막 열(column)의 채우기(fill) 방식을 지정합니다
column-gap : 다단 컨텐츠에서 열(column) 사이의 간격을 지정합니다
column-rule : 다단 컨텐츠의 열(column) 경계선(border)을 지정합니다.
column-rule-color : 다단 컨텐츠의 열(column) 경계선(border) 색상을 지정합니다.
column-rule-style : 다단 컨텐츠의 열(column) 경계선(border) 스타일을 지정합니다
column-rule-width : 다단 컨텐츠의 열(column) 경계선(border) 두께를 지정합니다
column-span : 요소를 다단 컨텐츠(multi-column content)로 분할할 때, 열(column)을 건너뛸 수 있는지 여부를 지정합니다
column-width : 다단 컨텐츠에서 각 열(column)의 너비를 지정합니다.
columns : 다단 컨텐츠(multi-column content)를 사용할 때 열(column)의 너비와 개수를 지정합니다
content : 가상 요소(pseudo-element)의 내용(content)을 지정합니다.
counter-increment : 요소 내부에서 사용되는 하나 이상의 카운터(counter) 값을 증가시킵니다
counter-reset : 요소 내부에서 사용되는 하나 이상의 카운터(counter) 값을 초기화합니다
cursor : 마우스 커서의 모양을 지정합니다.
direction : 요소의 텍스트 방향(direction)을 지정합니다.
display : 요소의 표시(display) 방법을 지정합니다.
empty-cells : HTML 테이블에서 빈 셀(empty cell)의 표시 여부를 정의하는 CSS 속성입니다.
filter : 이미지나 요소에 대해 적용할 수 있는 CSS 속성으로, 흐림(blur), 색상 반전(invert), 채도 조정(saturate) 등 다양한 필터 효과를 설정할 수 있습니다.
flex : 요소의 유연한(=flexible) 박스 모델을 정의하는 CSS 속성으로, flex container와 flex item으로 구성됩니다.
flex-basis : flex item의 초기 크기를 설정하는 CSS 속성입니다.
flex-direction : flex container에서 flex item의 배치 방향을 설정하는 CSS 속성입니다
flex-flow : flex-direction과 flex-wrap 속성을 함께 설정하는 축약형 속성입니다.
flex-grow : flex item이 남은 공간을 얼마나 채울지를 설정하는 CSS 속성입니다.
flex-shrink : flex item의 크기가 flex container보다 작아지는 경우 얼마나 줄어들지를 설정하는 CSS 속성입니다.
flex-wrap : flex item이 flex container 내에 한 줄로 배치되지 않고 여러 줄로 나뉘어 배치되는지를 설정하는 CSS 속성입니다.
float : 요소를 좌우 방향으로 띄워서 배치하는 CSS 속성입니다.
font : 글꼴과 글자 크기, 글자 굵기 등을 설정하는 CSS 속성입니다.
font-family : 폰트 종류를 설정합니다.
font-size : 폰트 사이즈 속성을 설정합니다.
font-size-adjust : 소문자를 기준으로 폰트 크기를 설정합니다.
font-stretch : 글자의 폭(너비)를 설정합니다.
font-style : 폰트의 스타일을 설정합니다.
font-variant : 글꼴 변형 형태를 일괄적으로 설정합니다.
font-variant-numeric : 숫자에 대한 글꼴 글리프(표시 형태)를 설정합니다.
font-variantligatures : 글꼴 글리프가 겹쳤을 때 설정합니다.
font-variant-emoji : 이모지 글꼴 글리프를 설정합니다.
font-variant-east-asian : 아시아 언어 글꼴 글리프를 설정합니다.
font-variant-caps : 소문자/대문자에 대한 글꼴 글리프를 설정합니다.
font-variant-alternates : 글꼴 글리프의 대체 형태를 설정합니다.
font-variant-position : 글꼴 글리프의 위치를 설정합니다.
font-variation-settings : 가변 폰트를 설정합니다.
font-weight : 폰트의 두께를 설정합니다.
grid : 행(Rows)과 열(Columns)을 가지며, 그리드 아이템(Items)을 배치할 수 있습니다.
grid-area : 그리드 유닛이 묶인 영역으로 고유한 식별자를 가지며, 식별자를 통해 요소를 배치할 수 있습니다.
grid-auto-columns : 암시적 열(Track)의 크기를 정의합니다.
grid-auto-flow : 배치하지 않은 아이템(Item)을 어떤 방식의 '자동 배치 알고리즘'으로 처리할지 정의합니다.
grid-auto-rows : 암시적 행(Track)의 크기를 정의합니다.
grid-column : 컨테이너에 Grid 트랙의 크기들을 지정해주는 속성입니다.
grid-column-end : 그리드 아이템의 열 끝 위치 지정합니다.
grid-column-gap : 열 사이의 간격을 설정합니다.
grid-column-start : 특정 item을 표시하기 시작할 열을 지정합니다.
grid-gap : 그리드 셀 사이의 간격입니다.
grid-row : grid-row-start/end 속성의 단축속성입니다.
grid-row-end : 특정 item을 표시하기 끝마칠 행을 지정합니다.
grid-row-gap : 행 사이의 간격을 설정합니다.
grid-row-start : 특정 item을 표시하기 시작할 행을 지정합니다.
grid-template : 명시적 행(Track)의 크기를 정의합니다.
grid-template-areas : 각 영역(Grid Area)에 이름을 붙이고, 그 이름을 이용해서 배치하는 방법입니다.
grid-template-columns : 통제를 벗어난 위치에 있는 트랙의 크기를 지정하는 속성입니다.
grid-template-rows : 명시적 행(Track)의 크기를 정의합니다.
hanging-punctuation : 글씨의 시작 및 끝의 위치 정의합니다.
height : 요소의 세로 크기를 설정합니다.
hyphens : 텍스트 줄바꿈을 할때 하이픈으로 연결하는 방법을 설정합니다.
isolation : 요소가 새로운 쌓임 맥락을 생성해야 하는지 지정합니다.
justify-content : 플렉스 요소의 수평 방향 정렬 방식을 설정합니다.
left : 왼쪽 영역을 말합니다.
letter-spacing : 글자 사이의 간격을 설정합니다.
line-height : 텍스트 라인의 높이를 설정합니다.
list-style : 항목의 종류를 이미지로 넣는 속성입니다.
list-style-image : 이미지를 ul, ol 등의 목록의 마커(marker)로 사용할 수 있습니다.
list-style-position : 항목을 어느 위치에서 시작할지 지정합니다.
list-style-type : 리스트에 다양한 마커(marker)를 적용할 수 있습니다.
margin : 테두리(border)와 이웃하는 요소 사이의 간격인 마진 영역의 크기를 설정합니다.
margin-bottom : 요소의 아래쪽에 바깥 여백 영역margin area을 설정합니다.
margin-left : 요소의 왼쪽에 바깥 여백 영역margin area을 설정합니다.
margin-right : 요소의 오른쪽에 바깥 여백 영역margin area을 설정합니다.
margin-top : 요소의 위쪽에 바깥 여백 영역margin area을 설정합니다.
max-height : 요소의 최대 세로 크기를 설정합니다.
max-width : 요소의 최대 가로 크기를 설정합니다.
min-height : 요소의 최소 세로 크기를 설정합니다.
min-width : 요소의 최소 가로 크기를 설정합니다.
mix-blend-mode : 어느 요소의 콘텐츠가 자신의 배경 및 부모와 어떻게 혼합되어야 하는지 지정합니다.
object-fit : 콘텐츠 크기를 어떤 방식으로 조절해 요소에 맞출 것인지 지정합니다
object-position : 콘텐츠 정렬 방식을 지정합니다
opacity : 요소의 불투명도를 설정합니다
order : 플렉스 또는 그리드 컨테이너 안에서 현재 요소의 배치 순서를 지정합니다
outline : 모든 외곽선 속성을 한꺼번에 지정합니다.
outline-color : 요소의 외곽선 색상을 설정합니다.
outline-offset :윤곽선과 요소의 가장자리 또는 테두리 사이의 간격을 설정합니다.
outline-style : 요소의 외곽선 스타일을 설정합니다
outline-width : 요소의 외곽선 넓이을 설정합니다
overflow : 요소의 콘텐츠가 너무 커서 요소의 블록 서식 맥락에 맞출 수 없을 때의 처리법을 지정합니다.
overflow-x : 콘텐츠가 블록 수준 요소의 왼쪽 및 오른쪽 가장자리를 오버플로할 때 표시할 내용을 설정합니다.
overflow-y : 콘텐츠가 블록 수준 요소의 위쪽 및 아래쪽 가장자리를 넘칠 때 표시되는 내용을 설정합니다.
overflow-wrap : 속성은 의미가 없는 텍스트 줄바꿈을 설정합니다.
padding : 속성은 요소의 네 방향 안쪽 여백 영역을 설정합니다.
padding-bottom : 요소의 아래쪽에 안쪽 여백 영역을 설정합니다.
padding-left : 요소의 왼쪽에 안쪽 여백 영역을 설정합니다.
padding-right : 요소의 오른쪽에 안쪽 여백 영역을 설정합니다.
padding-top : 요소의 위쪽에 안쪽 여백 영역을 설정합니다.
page-break-after : 현재 요소 다음에 페이지 나누기를 조정합니다.
page-break-before : 현재 요소 앞의 페이지 나누기를 조정합니다.
page-break-inside : 현재 요소 내에서 페이지 나누기를 조정합니다
perspective-origin : 뷰어가 보고 있는 위치를 결정합니다. 원근감 속성에 의해 소실점으로 사용됩니다.
perspective : 3D 위치 요소에 약간의 원근감을 주기 위해 z=0 평면과 사용자 사이의 거리를 결정합니다.
pointer-events : 어떤 상황(있는 경우)에서 특정 그래픽 요소가 포인터 이벤트의 대상이 될 수 있는지 설정합니다.
position : 요소가 문서에 배치되는 방식을 설정합니다. 위쪽, 오른쪽, 아래쪽 및 왼쪽 속성은 배치된 요소의 최종 위치를 결정합니다.
quotes: 인용 부호(quote)의 모양을 정의하는 CSS 속성입니다
resize: 요소의 크기 조절 가능 여부를 정의하는 CSS 속성입니다
right: 요소의 오른쪽 위치를 설정하는 CSS 속성입니다.
tab-size: 탭 문자(tab)의 크기를 설정하는 CSS 속성입니다.
table-layout: 테이블의 셀 너비를 조정하는 방식을 설정하는 CSS 속성입니다
text-align: 텍스트 정렬 방식을 설정합니다.
text-align-last: 문단의 마지막 텍스트 정렬 방식을 설정합니다.
text-decoration: 텍스트 라인 속성을 일괄적으로 설정합니다.
text-decoration-color: 글자 라인의 색상 속성을 설정합니다.
text-decoration-line: 글자 라인의 위치 속성을 설정합니다.
text-decoration-style: 꾸밈에 사용되는 선의 스타일 속성을 설정합니다.
text-decoration-skip-ink: 언더 라인의 글씨 겹침을 설정합니다.
text-decoration-thickness: 글자 라인의 굵기 속성을 설정합니다.
text-emphasis-color: 텍스트에 강조 표시 색상을 설정합니다.
text-emphasis-position: 텍스트에 강조 표시 위치를 설정합니다.
text-emphasis-style: 텍스트에 강조 표시 스타일을 설정합니다.
text-emphasis: 텍스트에 강조 표시를 일괄적으로 설정합니다.
text-indent: 문단 들여쓰기 속성을 설정합니다.
text-justify: 양쪽 정렬을 했을 때 정렬 유형을 설정합니다.
text-overflow: 텍스트가 영역을 벗어 났을 때 속성을 설정합니다.
text-shadow: 텍스트 그림자를 설정합니다.
text-transform: 텍스트를 대문자 또는 소문자로 바꾸는 속성을 설정합니다.
text-underline-offset: 언더 라인의 오프셋 값을 설정합니다.
text-underline-position: 언더 라인의 위치를 설정합니다.
top: 요소의 상단 위치를 설정하는 CSS 속성입니다
transform: 요소의 변환(translation, rotation, scaling) 효과를 정의하는 CSS 속성입니다.
transform-origin: 요소의 변환 기준점을 설정하는 CSS 속성입니다.
transform-style: 3D 변환된 자식 요소가 3D 공간에 있는 것처럼 렌더링되는지 여부를 설정하는 CSS 속성입니다.
transition: CSS 속성의 변화를 부드럽게 전환하는 효과를 설정하는 CSS 속성입니다
transition-delay: 속성 변화가 시작되기 전에 대기하는 시간을 설정하는 CSS 속성입니다.
transition-duration: 속성 변화가 일어나는 지속시간을 설정하는 CSS 속성입니다.
transition-property: 전환 효과를 적용할 CSS 속성을 지정하는 CSS 속성입니다. 이 속성에 지정한 속성이 변경될 때, 전환 효과가 적용됩니다.
transition-timing-function: 전환 효과의 타이밍 함수를 지정하는 CSS 속성입니다.
unicode-bidi: 언어 흐름과 문자 흐름의 방향을 설정하는 CSS 속성입니다
user-select: 사용자 선택 가능 여부를 지정하는 CSS 속성입니다.
vertical-align: 요소의 수직 정렬 방식을 설정하는 CSS 속성입니다.
visibility: 요소의 표시 여부를 설정하는 CSS 속성입니다
white-space : 줄바꿈 및 공백을 설정합니다.
width : 요소의 가로 크기를 설정합니다.
word-break : 줄바꿈을 할때 단어를 기준으로 설정하는 속성입니다.
word-spacing: 단어 사이의 간격을 설정하는 CSS 속성입니다.
word-wrap: 텍스트 줄 바꿈을 설정하는 CSS 속성입니다.
z-index: 요소의 쌓이는 순서를 설정하는 CSS 속성입니다

자바스크립트

CSS 속성 검색하기

indexOf() / search()