네이처리 노트

공부하면서 정리한 내용입니다 참고한 내용은 맨 아래의 링크를 확인해주세요 🎀 Position 태그를 어떻게 위치시킬지를 정의한다. ▽ 기본값 div.static { position: static; } ▽ 기본적으로 표시된 위치(본래위치)를 기준으로 새로운 위치를 지정 할 수 있습니다. top이나 left로 새로운 위치를 지정하지 않는 이상 표시된 위치와 다르지 않습니다. div.relative { position: relative; left: 100px; top: -100px; } ▽ 지정된 부모 요소(static아닌 다른값)를 기준으로해서 fixed 시키는 것과 같다고 생각하면 됩니다. div.parent { position:relative; } div.child { position:absolute; ..

공부하면서 정리한 내용입니다 참고한 내용은 맨 아래의 링크를 확인해주세요 🎀 폰트 앞에 입력한 폰트를 우선 적용한다. 컴퓨터에 지정된 폰트가 설치되어 있지 않을 경우, 뒤에 입력한 폰트가 적용된다. font-family: 'Roboto', sans-serif; font-family: 'Noto Sans KR', sans-serif; 폰트 색상 color: #000000; /*퓨어 검정*/ color: #555555; /*연한 검정*/ color: rgb(100,100,100); /*RGB 코드*/ color: aqua; /*웹 브라우저에 지정된 색상*/ 폰트 두께 font-weight: lighter /*100(최소)*/ font-weight: normal /*400*/ font-weight: bold ..

공부하면서 정리한 내용입니다 참고한 내용은 맨 아래의 링크를 확인해주세요 🎀 기본 선택자 *{ } /*전체 선택자*/ div{ } /*태그 선택자(태그명을 정확하게 표기)*/ .classname{ }/*클래스 선택자 (classname변경가능)*/ #idname{ }/*ID 선택자 (idname변경가능)*/ 🎀 복합 선택자 하위선택자와 자식선택자 div ul {} /*하위선택자: 해당하는 모든 하위요소*/ div>ul {} /*자식선택자: 바로 아래 자식요소*/ 조금 더 자세히 설명하자면 여기서 확실하게 해야할 것은 div가 여러개 이므로 부모div를 정확하게 명시해줘야한다. /* CSS */ div.eric>ul 인접형제선택자와 일반형제선택자 div+ul {} /*인접 형제 선택자: div를 뒤따르는 ..

공부하면서 정리한 내용입니다 참고한 내용은 맨 아래의 링크를 확인해주세요 input button은 스스로 닫는 태그 (열린태그) button은 스스로 닫지 않는 태그 하위 요소를 추가할 수 있다. 디자인 측면에서도 자유도가 더 높아진다. 이것을 클릭 해보세요 input의 한계를 넘기 위해 나온 것이 button이다. Reference 1) 버튼에 타입을 쓰는 이유 버튼에 타입을 쓰는 이유 (button type="button") 프롤로그 가끔 이렇게 type을 명시한 버튼을 마주칠 때가 있는데 전 항상 궁금하더라구요. "아니 버튼이면 버튼이지 버튼 타입 버튼은 대체 뭐람" 그러고보면 비슷하게 타입을 명시하는 이라는 nykim.work 2) input과 button의 공통점과 차이점