오류나 오타 신고 환영합니다
이곳의 내용들은 W3C의 Cascading Style Sheets Level 2 Revision 1 Specification의 내용을 기본으로 하고 있습니다. 또한 좀 더 쉬운 설명을 위하여 다양한 예제들을 jsfiddle라는 서비스를 이용하여 제공하고 있으며, 이해를 높이기 위한 이미지들을 계속해서 업데이트 할 예정입니다.
CSS 동영상 강의는 생활코딩의 css수업에서 보실 수 있습니다.
CSS Dictionary Index
박스모델
Box model
배치
Visual formatting model
| display | position | top, right, bottom, left | float | clear |
| z-index | direction | unicode-bidi |
배치 - details
Visual formatting model details
| width | min-width | max-width | line-height | |
| height | min-height | max-height | vertical-align |
시각 효과
Visual effects
| overflow | clip | visibility |
내용생성과 목록
Generated content, automatic numbering, and lists
| content | quotes | counter-reset | counter-increment | |
| list-style-type | list-style-image | list-style-position | list-style |
인쇄를 위한 스타일
Paged media
| page-break-before | page-break-after | page-break-inside |
색상과 배경
Colors and Backgrounds
| background-color | background-image | background-repeat | background-attachement | background-position |
| background | colors |
글꼴
Fonts
| font-family | font-style | font-variant | font-weight | font-size |
| font |
텍스트
Text
| text-indent | text-align | text-decoration | text-shadow | letter-spacing |
| word-spacing | text-transform | white-space |
테이블
Tables
| caption-side | table-layout | border-collapse | border-spacing | empty-cells |
사용자 인터페이스
User interface
| cursor | outline-style | outline-color | outline-width | outline |
JSFIDDLE
이곳에서는 여러가지 css예제를 jsfiddle이라는 서비스를 이용하여 보여주고 있습니다, 직접 타이핑하거나 코드들을 수정하여 결과를 바로 확인해 볼 수도 있으니 공부할때 최대한 활용하면 좋을것 같습니다. 자세한 jsfiddle사용법은 생활코딩에서 참고하기 바랍니다.
자매품 HTML Dictionary도 있습니다.
