[TIL] #04 자주 쓰이는 CSS 속성 정리

📑 css를 하면서 자주 쓰이는 속성들을 정리를 해보겠다.

1. margin : 외부 여백
2. padding : 내부 여백
3. border : 테두리(경계선)
4. list-style: disc(검은 동그라미), circle(빈동그라미), square(네모), none(없음)
5. quotes : 인용문을 감싸는 큰 따옴표를 다른 기호 또는 문자로 바꿔줌
6. content : 선택한 요소의 내용 앞이나 뒤에 content를 붙임
7. vertical-align : 세로 정렬 방식을 정함
8. display : 태그 표현 방법
9. background-color : 배경 색상
10. cursor : 해당 태그에 마우스를 올렸을 때 마우스 상태
11. background : 배경
12. direction : 텍스트 방향
13. font-size : 글자 크기
14. line-height : 텍스트 줄 간격
15. font-family : 글꼴
16. color : 글자 색상
17. text-decoration : none(없음), overline(텍스트 위에 줄긋기), line-through(텍스트 중간에 줄긋기), underline(아래 밑줄 긋기)
18. font-style : normal(기본), italic(기울임)
19. font-weight : 두께 설정
20. width: 가로 길이
21. position : 태그를 표시할 방법
22. z-index : 태그의 z 인덱스(높을수록 다른 태그 위에 배치됨)
23. border-top : 테두리 윗부분
24. clear : none, left, right, both
25. float : 태그 정렬 방법(none, left, right)
26. margin-right : 외부 여백 오른쪽
27. border-bottom : 테두리 아래
28. margin-top : 외부 여백 윗부분
29. top : 화면 맨 위쪽으로부터 태그 객체 위쪽 모서리까지의 거리
30. left : 화면 맨 왼쪽
31. height : 세로 길이
32. letter-spacing : 텍스트 글자 간격
33. text-align : 글자 정렬
34. overflow : 텍스트 문장의 길이가 너무 길어서 화면 영역을 벗어나면 문장의 뒷부분에 텍스트가 더 있다는 의미로 말 줄임표시가 나타나도록 하는 속성
35. white-space : 공백문자 처리 속성
36. opacity : 투명도 조절
37. filter : 익스플로러에서만 지원되는 속성, 흐려지는 등의 여러 가지 효과
38. text-indent : 들여쓰기
39. box-shadow : 박스 그림자 효과
40. background-image : 배경 이미지 지정
41. border-radius : 모서리를 둥글게 만들 때 사용

더 많은 용어를 보려면 👉출처:오윤석님 블로그 참고.🏻