SMALL 전체 글133 box-sizing 제대로 알기 html 박스크기 계산법 /////// 박스크기 계산법 가로기준 with:100 border: 10 padding: 10 1) 표준계산법 width + padding + border = 140 2) 테두리기준 widht값에 border와 padding을 포함해서 계산 컨텐츠의 영역은 : 60 box-sizing: content-box : 표준계산법 : 정적페이지 (width값 + 테두리값 = 전체 넓이값이됨) border-box : 테두리계산법 ------> 반응형페이지 필수 (width값 안에 테두리 값까지 넣는 방식) 2023. 3. 13. html css Overflow /////// Overflow 부모가 고정된크기 ( 200 * 200) 자식이 부모보다 클때 ( 300 * 300) 자식이 부모의 영역을 벗어나는경우 => overflow 부모 기준으로 자식을 보여주거나 감출수 있음 또는 스크롤생성가능 디폴트는 보여줌 overflow : hidden ( 넘치는 자식요소는 숨김 ) 2023. 3. 13. border-radius ( html css 모서리 둥글게 만들기 ) /// border-radius ( 모서리 둥글게 만들기 ) 방향설정은 왼쪽상단코너에서 시계방향 Top left, Top Right, Bottom Right, Bottom left 1 2 3 4 border-radius:50px (모든방향) border-radius:50px 30px 40px 10px; 1 2 3 4 border-radius:100px 200px; 1,3 2,4 border-radius:100px 200px 300px; 1 2,4 3 2023. 3. 13. hover 기능과 block ///////// 가상클래스 선택자 사용하기 선택자:hover ( 선택자에 마우스가 올라갈때 ) /////// HTML Tag 기본작성규칙 1. 블록요소는 블록요소를 포함가능 2. 블록요소는 인라인요소를 포함가능 3. 인라인요소는 인라인요소를 포함가능 4. 인라인요소는 블록요소를 포함X 5. 인라인요소는 블록요소안에 작성할것을 권장. 권장하지않음 권장표현방식 2023. 3. 13. 이전 1 ··· 15 16 17 18 19 20 21 ··· 34 다음 LIST
