SMALL 전체 글133 html css 리스트 메뉴menu 만들기 클론코딩 3 +code DOCTYPE html> Document body { padding: 50px; } .cl { display: flex; background-color: #eee; } .cl > li { flex:none; width: 256px; position: relative; } .cl > li > a { display: block; line-height: 63px; font-size: 20px; color:#e42c01; font-weight: 700; letter-spacing: -1px; background: #ddd; } /* 2레벨 */ .cl .sub { background: #e42c01; position: absolute; position: absolute; left:0; top:63px; widt.. 2023. 3. 21. html css 리스트 메뉴menu 만들기 2 +code DOCTYPE html> Document body { padding:50px; } /* 1레벨 */ .menu1 { width: 200px; } .menu1 > li { border-bottom: 1px solid #333; } .menu1 > li:first-child { border-top:1px solid #333; } .menu1 > li > a { display: block; font-size: 20px; line-height: 30px; text-align: center; color:#111; } /* 2레벨 */ .menu1 .depth2 { display: none; } .menu1 .depth2 li { border-top: 1px solid #ccc; } .menu1 .depth2 li.. 2023. 3. 21. html css 리스트 연습하기1 DOCTYPE html> Document 한식 국밥 김밥 김치찌개 중식 자장면 짬뽕 우동 양식 파스타 짬뽕 우동 포탈사이트 다음 블로그 카페 웹툰 네이버 네이트 방송국 mbc sbs kbs 게임사이트 게임 게임 게임 메뉴 하위메뉴 하위메뉴 하위메뉴 2023. 3. 21. html css 가시성제어, 마우스이벤트, not() 부정선택자,background ///가시성 제어 (show, hide) 1.display - ******** display:none (화면에서 완전히 제거) display:block (화면에서 다시나타남) 2.visibility visibility:hidden; (숨김) - 오브젝트는 존재 visivility:visible (나타남) 3.opacity - ******** 0투명 ~ 1불투명 박스안에 모든요소가 투명 opacity : 0 opacity : 1 *1번하고 3번을 많이 사용함 마우스이벤트 1.마우스가 올라가는 상태 (호버) hover (event + out) 모바일에서 호버는 사용안됨 모바일 : hover X CSS 구현가능 -> 조건에 따라서 JS를 같이 사용 CSS단독구현 CSS + JS 혼용 선택자1에 hover가 되.. 2023. 3. 21. 이전 1 ··· 12 13 14 15 16 17 18 ··· 34 다음 LIST
