includes()를 이용하여 CSS 속성 검색하기

CSS 속성 검색하기

검색하기

전체 속성 개수 : 0개

all: all 속성은 CSS 속성을 재설정하는데 사용하는 약식 속성이다
animation: animation 속성은 애니메이션 속성을 설정하기 위한 약식 속성이다
animation-delay: animation 속성은 애니메이션이 시작되는 시간을 설정한다
animation-direction: 애니메이션이 움직이는 방향을 설정한다
animation-duration: 애니메이션이 움직이는 시간을 설정한다
animation-fill-mode: a애니메이션이 실행 중인 시간 외에 적용되는 값을 정의한다
animation-iteration-count: 애니메이션이 중지되기 전에 애니메이션의 주기가 재생되는 횟수를 지정하는 데 사용된다
animation-name: 키프레임 규칙에 의해 정의된하나 이상의 애니메이션 이름을 지정하는 데 사용되며 선택한 요소에 적용된다
animation-play-state: CSS 애니메이션이 실행 중인지 일시 중지되었는지 지정한다
animation-timing-function: 애니메이션 효과(동작)의 시간당 속도를 설정한다
appearance: 브라우저에 기본적으로 설정되어 있는 테마를 기반으로 요소를 표현한다
background: 텍스트 색상, 위치, 반복 여부, 위치 ,크기등을 설정한다
background-attachment: 배경 이미지의 스크롤 여부를 설정한다
backdrop-filter: CSS를 사용하여 요소 뒤의 콘텐츠에 필터 효과를 적용한다
backface-visibility: 뷰어를 향할 때 변형된 요소의 뒷면이 보이는지 여부를 결정한다
background-blend-mode: 요소들이 겹칠 경우 색상이 어떻게 나타나야 하는지를 설정한다
background-clip: 요소의 배경이 테두리, 안쪽 여백, 콘텐츠 상자 중 어느 범위까지 크기가 확대될지를 설정한다
background-color: 요소의 배경 색을 지정한다
background-origin: 배경 이미지를 어느 범위부터 채워 나갈지를 설정한다
background-position: 배경의 위치를 설정한다
background-repeat: 배경 이미지의 반복 여부와 반복 방향을 설정한다
background-size: 배경 이미지의 크기를 설정한다
border: 요소의 테두리를 설정한다 width, style, color 순서로 값을 대입한다
border-bottom: 요소의 아래쪽 테두리를 설정한다
border-bottom-color: 요소의 아래쪽 테두리의 색상을 설정한다
border-bottom-left-radius: 요소의 왼쪽 테두리의 경계를 둥근 모양으로 변경한다
border-bottom-right-radius: 요소의 오른쪽 테두리의 경계를 둥근 모양으로 변경한다
border-bottom-style: border-bottom 속성과 마찬가지로 요소의 아래쪽 테두리를 설정한다
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-rigth-radius : 속성은 윗부분 오른쪽 모서리 굴곡을 설정한다.
border-top-style : 테두리 위쪽 스타일 속성을 설정한다
border-top-width : 테두리 위쪽 두께 속성을 설정한다
bottom : 위치 요소의 아래쪽 속성을 설정한다
box-decoration-break : 컬럼 및 줄바꿈시 테두리와 패딩의 방식을 설정한다
box-shadow : 박스 요소의 그림자를 설정한다
box-sizing : 요소 크기에 패딩 포함 여부를 설정한다
caption-side : 테이블 설명의 위치를 설정한다.
caret-color : 입력부분의 커서 색을 설정한다
clear : float 요소의 기능을 해제한다
clip : 보이는 영역을 설정한다
color : 글씨 색상을 설정한다
column-count : 해당 요소를 몇 개의 열으로 나눌지를 설정한다
column-fill : 열의 지정방법을 정의한다
column-gap : 열의 간격을 설정한다
column-rule : 열의 라인의 가로값, 스타일, 색상을 설정한다
column-rule-color : 컬럼의 라인 색을 설정한다.
column-rule-style : 컬럼 라인의 스타일을 설정한다.
column-rule-width : 컬럼 라인의 가로값을 설정한다.
column-span : 열의 속성을 설정한다.
column-width : 컬럼의 가로 값을 설정한다.
columns : 컬럼의 열의 폭과 열의 수를 설정한다.
content : 콘텐츠 내용을 설정한다.
counter-increment : 콘텐츠의 순서 상태를 설정한다.
counter-reset : 콘텐츠의 숫자를 초기화한다
cursor : 마우스 오버시 마우스 포인터를 설정한다.
direction : 문장의 방향을 설정한다.
display : display의 해당 요소를 어떻게 보여줄지를 지정할수있다
empty-cells : 테이블의 빈요소의 속성을 설정한다.
filter : 그래픽 효과를 설정한다.
flex : 콘텐츠의 성질을 flex로 설정한다.
flex-basis : 요소의 기본 단위를 설정한다.
flex-direction : 요소의 정렬 방향을 설정한다.
flex-flow : 요소의 정렬 방향 flex-direction와 줄 속성 flex-wrap을 같이 설정한다.
flex-grow : 요소의 크기를 숫자를 통해 설정한다.
flex-shrink : 요소의 크기를 숫자를 통해 줄여줍니다.
flex-wrap : f 요소의 줄 속성을 설정한다.
float : 블록요소의 정렬 상태를 설정한다.
font : 폰트에 관한 설정을 설정한다.
font-family : 폰트 종류를 설정한다.
font-size : 폰트의 크기를 조절할수 있다
font-size-adjust : 속성은 소문자를 기준으로 폰트 크기를 설정한다.
font-stretch : 폰트의 굵기를 설정한다.
font-style : 폰트의 스타일을 설정한다.
font-variant : 글꼴의 변형을 설정한다.
font-weight : 폰트의 가중치나 굵기를 명시할수있다.
grid : flex와 달리 가로세로(2방향)설정이 가능한 2차원 레이아웃 설정
grid-area : 영역(Area) 이름을 설정하거나, grid-row와 grid-column의 단축 속성
grid-auto-columns : 암시적인 열(Track)의 크기를 정의
grid-auto-flow : 자동 배치 알고리즘 방식을 정의
grid-auto-rows : 암시적인 행(Track)의 크기를 정의
grid-column : grid-column-xxx의 단축 속성(열 시작/끝 위치)
grid-column-end : 속성은 그리드 아이템의 열 끝 위치 지정
grid-column-gap : 속성은 열과 열 사이의 간격(Line)을 정의
grid-column-start : 그리드 아이템의 열 시작 위치 지정
grid-gap : 행과 열 사이의 간격을 설정한다.
grid-row : grid-row-xxx의 단축 속성(행 시작/끝 위치)
grid-row-end : 그리드 아이템의 행 끝 위치 지정
grid-row-gap : 행과 행 사이의 간격(Line)을 정의
grid-row-start : grid-row-start 그리드 아이템(Item)의 행 시작 위치 지정
grid-template : grid-template-xxx의 단축 속성
grid-template-areas : 영역(Area) 이름을 참조해 템플릿 생성
grid-template-columns : 명시적 열(Track)의 크기를 정의한다
grid-template-rows : 명시적 행(Track)의 크기를 설정한다
hanging-punctuation : 글씨의 시작 및 끝의 위치 설정한다.
height : 콘텐츠 요소의 세로값을 설정한다
hyphens : 텍스트의 하이픈(-) 영역을 설정한다
isolation : stacking context을 설정한다.
justify-content : 콘텐츠의 좌우 관계 정렬 상태를 설정한다.
left : 위치 요소의 왼쪽 속성을 설정한다.
letter-spacing : 글자 사이의 간격을 설정한다.
line-height : 문장과 문장 사이의 간격을 설정한다.
list-style : 목록 스타일 속성을 설정한다.
list-style-image : 목록 마커의 이미지를 설정한다.
list-style-position : 목록 마커의 위치 속성을 설정한다.
list-style-type : 목록 마커의 유형을 설정한다.
margin : 요소의 네 방향 바깥 여백 영역을 설정한다.
margin-bottom : 요소의 아래쪽에 바깥 여백 영역을 설정한다.
margin-left : 요소의 왼쪽에 바깥 여백 영역을 설정한다.
margin-right : 요소의 오른쪽에 바깥 여백 영역을 설정한다.
margin-top : 요소의 위쪽에 바깥 여백 영역을 설정한다.
mask : 아이템이 부분적으로만 보여지게 하거나 혹은 완전히 가려서 보여지지 않게 할 수 있는 기능을 가지고 있다 이 속성은 마스킹 혹은 특정한 점을 기준으로 이미지를 잘라내는 기능을 함께 제공한다
mask-border : 요소의 경계의 가장자리를 따라 마스크를 만들 수 있다
mask-border-mode : 마스크 테두리에 사용되는 혼합(blending) 모드를 설정한다.
mask-border-outset : mask-border-outset 요소의 마스크 테두리가 테두리 상자에서 설정되는 거리를 설정한다.
mask-border-repeat : 소스 이미지의 가장자리 영역이 요소의 마스크 테두리 크기에 맞게 조정되는 방식을 설정한다.
mask-border-slice : mask-border-source로 설정된 이미지를 영역으로 나눈다. 이 영역은 요소의 마스크 테두리 구성 요소를 형성하는 데 사용된다.
mask-border-source : 요소의 마스크 테두리를 만드는 데 사용되는 소스 이미지를 설정한다.
mask-border-width : 요소의 마스크 테두리 너비를 설정한다.
mask-clip : 마스크의 영향을 받는 영역을 결정한다 요소의 칠해진 콘텐츠는 이 영역으로 제한되어야 한다
mask-composite : 현재 마스크 레이어 아래에 마스크 레이어가 있는 합성 작업을 나타낸다
mask-image : 요소를 url에 지정된 이미지 만큼만 보이게 처리한다
mask-mode : mask-image에 의해 정의된 마스크 참조가 광도 또는 알파 마스크로 처리되는지 여부를 설정한다.
mask-origin : 마스크의 원점을 설정한다.
mask-position : background-position처럼 마스크에 보일 요소위치를 설정한다.
mask-repeat : 마스크 이미지가 반복되는 방식을 설정한다. 마스크 이미지는 가로축, 세로축, 양축을 따라 반복하거나, 반복하지 않을 수 있다
mask-size : background-size처럼 보일 요소의 크기를 설정한다.
mask-type : SVG mask 요소를 밝기 또는 알파 마스크로 사용할지 여부를 설정한다. mask 요소 자체에 적용됩니다.
max-height : 요소의 최대 세로값을 설정한다.
max-width : 요소의 최대 가로 값을 설정한다.
min-height : 요소의 최소 세로 값을 설정한다.
min-width : 요소의 최소 가로 값을 설정한다.
mix-blend-mode : 배경의 혼합 상태를 설정한다.
object-fit : 대체되는 요소의 내용(<img>, <video>, <object>, <svg> 등과 같은)이 지정된 너비와 높이에 맞게 적용되는 방식을 지정한다.
object-position :기본적으로 요소의 가운데로 화상을 이동시킨다. 이 위치를 원하는 값으로 변경한다.
opacity : 요소의 투명도를 제어하는데 사용된다.
orphans : 페이지, 영역 또는 열의 맨 아래에 표시되어야 하는 블록 컨테이너의 최소 줄 수를 설정한다.
outline : 요소 주위에 윤곽선을 그리는 데 사용된다.
outline-color : 요소의 윤곽선 색상을 설정하는 데 사용된다.
outline-offset : 요소 윤곽선의 가장자리 또는 테두리 사이의 간격을 설정한다.
outline-style : 요소의 윤곽선 스타일을 설정하는 데 사용된다.
outline-width : 요소의 윤곽선 너비를 설정하는 데 사용된다.
overflow : 요소의 경계를 넘은 콘텐츠를 표시할지 여부를 설정한다.
overflow-x : 요소의 콘텐츠를 표시할지, 잘릴지(숨겨야 하는지) 또는 콘텐츠가 요소의 왼쪽 및 오른쪽 가장자리를 넘을 때 수평 스크롤 막대를 추가할지 여부를 지정하는 데 사용된다.
overflow-y : 요소의 콘텐츠를 표시할지, 잘릴지(숨겨야 하는지) 또는 콘텐츠가 요소의 위쪽 및 아래쪽 가장자리를 넘을 때 세로 스크롤 막대를 추가할지 여부를 지정하는 데 사용된다.
padding : 한 번에 요소의 네 면에 패딩 영역(내용(content)과 테두리(border) 사이의 간격)을 설정한다.
padding-bottom : 요소의 아래쪽 패딩 영역(내용(content)과 테두리(border) 사이의 간격)을 설정
padding-left : 요소의 왼쪽 패딩 영역(내용(content)과 테두리(border) 사이의 간격)을 설정
padding-right : 요소의 오른쪽 패딩 영역(내용(content)과 테두리(border) 사이의 간격)을 설정
padding-top : 요소의 위쪽 패딩 영역(내용(content)과 테두리(border) 사이의 간격)을 설정
page-break-after : 페이지 인쇄시 적용된 요소 뒤부터 페이지 분리에 관한 설정을 설정한다.
page-break-before : 페이지 인쇄시 적용된 요소 앞부터 페이지 분리에 관한 설정을 설정한다.
page-break-inside : p 요소 내부에서 페이지 넘김을 설정한다
perspective : 3차원 공간을 활성화하여 해당 요소의 자식이 해당 공간에 배치될 수 있도록 하는 데 사용된다.
perspective-origin : 뷰어가 3차원 공간을 바라보는 위치를 선택하는 데 사용된다.
pointer-events : 특정 그래픽 요소가 포인터 이벤트의 대상이 될 수 있는 조건을 제어하는데 사용된다 .
position : 페이지에서 요소의 위치를 설정하는 데 사용된다 .
quotes : 속성을 사용하여 삽입할 때 사용할 따옴표를 지정하는 데 사용된다
resize : 사용자가 요소의 크기를 조정할 수 있는지 여부와 가능한 경우 방향을 지정할 수 있다
right :위치 지정 요소의 오른쪽 오프셋을 지정하는 데 사용되는 오프셋 속성입니다 .
shape-image-threshold : css모양 외부에 이미지를 사용할 때 모양을 추출하는 데 사용되는 알파 채널의 임계값을 설정하는 데 사용된다.
shape-margin : css모양에 여백을 추가하는 데 사용된다.
shape-outside : float된 요소의 경계를 감싸는 방식을 제어하는 데 사용된다.
tab-size : 속성은 페이지에 표시되는 탭 문자의 너비를 결정하는 데 사용된다.
table-layout : 테이블 열, 행 및 셀의 레이아웃을 설정한다.
text-align : 블록 요소 내부의 인라인 요소가 정렬되는 방식을 제어하는 데 사용된다.
text-align-last : 강제 줄 바꿈 직전의 블록이나 줄의 마지막 줄을 정렬하는 방법을 설정하는 데 사용된다.
text-decoration : 텍스트 위, 텍스트 아래 또는 텍스트 위에 선 형태로 장식을 추가하거나 기존 장식을 제거하는 데 사용된다
text-decoration-color : 요소에 설정된 텍스트 장식(밑줄, 윗줄 및 선 통과)의 색상을 설정한다
text-decoration-line : 글자 라인 스타일을 설정한다.
text-decoration-style : text-decoration-line이 있는 요소에 설정된 선(밑줄, 윗줄 및 선 통과)의 스타일을 설정한다.
text-indent : 텍스트를 담고있는 블록 컨테이너에 적용되며 문단첫줄을 들여쓰기 할 때 사용한다
text-justify : 텍스트의 간격을 설정한다.
text-orientation : 콘텐츠 줄 내에서 문자의 방향을 설정한다.
text-overflow : 박스 안에 내용이 넘칠 때 텍스트를 어떻게 처리할지 지정하는 속성입니다.
text-rendering : 텍스트를 렌더링할 때 최적화할 항목을 선택할 수 있는 속성입니다.
text-shadow :텍스트에 그림자를 추가할 때 설정한다.
text-transform : 대문자로 또는 소문자로 바꾸는 속성입니다.
top : 각 옵션 속성들의 부모 태그를 기준으로 수직으로 위치를 설정한다.
touch-action : 어떤 요소 내에서 브라우저가 처리할 터치 액션의 목록을 설정한다.
transform : 요소에 회전, 크기 조절, 기울이기, 이동 효과를 설정한다.
transform-origin : transform 속성과 함께 사용되는 속성으로, 회전 중심(원점·기준점)을 설정한다.
transform-style : 자식 요소를 3D 공간에 배치하거나 2D 평면에 평평하게 배치 할지 설정한다.
transition : 특정 조건 하에서 변화하는 과정을 애니메이션으로 보여주고자 할 때 설정한다.
transition-delay : 프로퍼티가 변화한 시점과 트랜지션이 실제로 시작하는 사이에 대기하는 시간을 초 단위(s) 또는 밀리 초 단위(ms)로 설정한다.
transition-duration : 애니메이션 소요 시간을 설정한다.
transition-property : transition의 적용 여부를 설정한다.
transition-timing-function : 요소의 움직임 기능을 설정한다.
unicode-bidi : 글자의 방향 속성을 설정한다.
vertical-align : 텍스트의 상하 정렬 방식을 설정한다.
visibility : 요소를 보이지 않게 설정한다.
white-space : 줄바꿈, 공백, 줄 속성을 설정한다.
widows : 페이지, 영역 또는 열의 맨 위에 표시되어야 하는 블록 컨테이너의 최소 줄 수를 설정한다.
width : 요소의 가로 값을 설정한다.
will-change : 값이 변경될 속성에 대한 힌트를 미리 설정한다.
word-break : 줄바꿈 속성을 설정한다.
word-spacing : 단어 사이의 간격을 설정한다.
word-wrap :줄바꿈을 설정한다.
writing-mode : 텍스트의 방향(가로/세로)를 설정한다.
z-index : 요소의 위치가 겹칠 경우 순서를 설정한다.