본문 바로가기

css

(11)

[CSS] margin, padding / 차이점 width = width + (padding*2) + (border*2) px 📌 padding vs margin padding, border => width에 관여 margin => width에 관여 X (공간들끼리 서로 밀어내는 것) margin: 0 auto; : 가운데 정렬 box-sizing: border-box; : border가 width에 영향 주지 않게 해준다. margin이 겹치면, 더 작은 margin이 상쇄된다. 자식 margin이 부모를 넘어가면 미적용된다. => 그러므로, 부모가 padding을 가지는 것 > 자식이 margin을 가지는 것 자식 margin과 부모 padding은 섞이지 않는다. +된다. , 태그 등은 기본적으로 margin 값을 가지고 있다. css에서 속성은..

[CSS] font / background / border 속성 정리 css에서 속성은 '시계 방향'으로 적용 4개일 때 : top right bottom left 2개일 때 : x축(top, bottom) y축(left, right) 1개일 때 : all 🔗 Font color : 텍스트 색상 font-size : 텍스트 사이즈 default : 16px font-weight : 텍스트 굵기 · 100 : thin · 300 : light · 400 : regular · 500 : medium · 700 : bold · 900 : extrabold letter-spacing : 자간 (글자 간격) word-spacing : 단간 (단어 간격) white-space · normal : width에 맞추어 자동으로 줄바꿈 default · nowrap : width에 상관없..

HTML / CSS / JavaScript 의 역할 및 차이점 🔗 HTML (Hypertext Markup Language) - 웹 문서를 만들기 위하여 사용하는 기본적인 웹 언어 - 웹의 뼈대, 구조를 설계하는 역할 🔗 CSS (Cascading Style Sheets) - 웹 문서의 전반적인 스타일을 미리 저장해 둔 스타일시트 - HTML에 살과 옷을 입혀 웹을 꾸며주는 역할 (색깔, 글씨체 등 디자인 요소) 🔗 JavaScript - 웹 문서의 동작을 담당하는 크로스 플랫폼(cross platform), 객체지향 스크립트 언어 - 웹의 동적(시각적 변화) 반응을 처리하는 역할 더 이해하기 쉽게 우리 '몸'을 예를 들어 설명해 보도록 하겠습니다! HTML은 몸의 뼈 CSS는 뼈를 감싸는 살과 옷 JavaScript는 몸을 움직이는 동적 반응 이라고 할 수 있겠네..

이전 1 2 다음

티스토리툴바