에러왕

1)크롬 개발자도구 - 유저 에이전트 스타일시트 (user agent Stylesheet) html에 직접 스타일 적용-> 인라인스타일이라고함 이거는 우선순위가 제일 높음. 2)코드순서 나중에 쓸수록 우선순위가 높음. 3)선택자의 명시도에 따라 (selector Sepcificity ) vs코드에서 css에 마우스 올려보면 나옴 구글에 calculator 검색하면 나옴. 위쪽에있는거일수록 점수가 더 높음. 선택자가 복잡할수록 점수가 높아서 우선적으로 캐스캐이드한다. 아이디개수,클래스개수,요소개수를 순서대로 나열해서 점수를 매긴다. for example) 1) h1 : 001 2) h1.headline: 011 3) h1#main : 101 4) h1.large.headline : 021 3번과 4번이 헷..

:nth-child() *gallery의 세번째 자식 .gallery :nth-child(3) { ... } *gallery의 짝수번째 자식 .gallery :nth-child(even) { ... } .gallery :nth-child(2n) { ... } *gallery의 홀수번째 자식 .gallery :nth-child(odd) { ... } .gallery :nth-child(2n+1) { ... } *첫번째, 마지막자식 .gallery :first-child { ... } .gallery :last-child { ... }

개발자도구에서 우측클릭 - force state 통해서 확인할수있음 : 로 시작하고 active hover visited focus 예를들어 a{ color : #12172a; text-decoration: none; } a:hover { text-decoration: underline; } 가상 클래스는 의사 클래스, 가짜 클래스라고도 부릅니다. 요소의 상태 같은 걸 선택할 때 사용하는 클래스입니다. 정해진 이름 앞에 콜론(:)을 붙여서 사용합니다. 대표적으로 :hover(마우스를 올렸을 때), :active(클릭한 상태), :visited(방문한 적이 있는 링크), :focus(포커싱 됐을 때)등이 있습니다. 예를 들어서 밑줄이 없는 링크에 마우스를 올렸을 때 밑줄이 생기도록 하려면 :hover를 활..

none은 a태그의 밑줄없애는데 사용. underline은 줄 긋는거 line-through는 취소선 긋는거 .none { text-decoration: none; } .underline { text-decoration: underline; } .line-through { text-decoration: line-through; } 2. 줄높이는 이렇게 변경한다. p { line-height: 1.5; }

1.절대적인단위 -> px 이 있음 픽셀은 -화면을 표시하는 기준이 되는 가장 작은 정사각형 -예를들어 10px= 정사각형 10개의 길이 ppl(pixel per inch) 모니터에서 1인치 정사각형안에 픽셀이 몇개나 들어가는지 촘촘할수록 더 높은거 해상도(resolution) 화면에 가로로 몇px, 세로로 몇 px을 보여주는지.. 그랫거 모니터에따라서 보여지는게 다를수있음. 2.상대적인단위 2-1) 퍼센트 부모태그에 대해서 상대적인크기/ 크기를 바꾸고 싶을대 부모크기만 바꾸면됨 예) 부모가 200 px * 100 px일때 50% * 50% = 100px * 50px 2-2) em, rem em 인쇄에서 전통적으로 대문자 M의 크기 css에서 1em= 부모태그의 font-size 16px 2em = 16..