moonday

더보기 /* - 메뉴를 꼭 리스트 태그를 이용하지 않아도 됨. 하지만 일반적으로 메뉴는 상위메뉴, 하위메뉴로 구성되어있기 때문에 리스트 태그로 많이 작업함. - list-style-type : 리스트 마커 지정, 마커는 리스트 앞에 있는 숫자나 모양 - list-style-image : 리스트 마커를 이미지를 이용하여 지정 - list-style-position : 리스트 마커의 위치(안insdie/밖outside - 기본값) - list-style : 위 3개를 한번에 지정 - 모든 태그에서 CSS와 관련된 속성들은 사용하지않는 것이 표준 - ul태그에서 type속성을 이용하여 마커를 지정(구식)하지 말고 위에 표기된 CSS를 이용하여 지정 */ 사과 포도 배

더보기 - 자식 요소의 내용이 부모 요소의 크기를 벗어난 경우 어떻게 나타낼지 알려주는 속성 - visible : 기본값, 넘어간 내용을 보여줌 - hidden : 넘어간 내용을 숨김 - scroll : 넘어간 내용을 숨기고 숨겨진 내용을 확인할 수 있는 스크롤이 무조건 생성 - auto : 내용이 넘어가지 않으면 그대로이고, 넘어가면 스크롤이 자동으로 생김 더보기 auto와 scroll에서 스크롤바를 없애고 기능을 유지할 때 /* scrollbar-width: none; Firefox */ /* -ms-overflow-style: none; IE and Edge*/} /*.box::-webkit-scrollbar{display: none; Chrome, Safari, Opera }*/ - 자식 요소의 ..

http://127.0.0.1:5500/practice4/transform.html 더보기↓ 더보기 /* - transform은 회전, 확대와 같이 모양을 변경할 때 사용 - translate(x,y) : x,y만큼 이동 - translateX(x) : x축 값이 x만큼 이동, 좌/우로 이동 - translateY(y) : y축 값이 y만큼 이동, 상/하로 이동 - scale(w,h) : 가로방향으로 w배만큼 조절, 세로방향으로 h배 만큼 조절 - scaleX(w) : 폭을 w배 만큼 조절, 가로 길이 조절 - scaleY(h) : 높이를 h배 만큼 조절, 세로 길이 조절 - rotate(a) : a각도만큼 시계 방향 회전 - skewX(a) : x축 기준으로 x만큼 기울임 - skewY(y) : y축 ..

더보기 파랑과 빨강박스가 한곳에있지만 z-index가 빨강이 더 높아서 빨강만 보임 더보기 z-index가 높은 순서 : 갈색100> 빨강3 > 파랑2 > 보라1 가장 위에 출력되는 순서 : 빨강3 > 파랑2 > 보라1 > 갈색100 ** 갈색은 z-index가 아무리 높아도 position이 static기본이라서 position이 absolute를 절대 앞지를 수 없다 더보기 부모B1은 자식B1-1을 가지고있고(.B1>.B1-1), 부모B2는 자식B2-2를 가지고 있음(.B2>.B2-1). 4개의 박스 모두 position이 absolute상태로 동등 z-index가 높은 순서 : b1-1 >b2 > b1=b2-1 출력이 가장 위인 순서 : B2-1>B2>B1-1>B1 **z-index는 자식-자식, ..