연습장

https://codesandbox.io/

https://opentutorials.org/course/2473/13712 핀터레스트 스타일 레이아웃 만들기 (masonry) - 생활코딩 소개 masonry는 벽돌을 쌓는 공사, 석조라는 의미를 가지고 있습니다. 사진 공유 서비스인 핀터레스트가 인기를 끈 이후에 핀터레스트와 같은 스타일의 레이아웃이 크게 인기를 끌었는데요. 이러 opentutorials.org width를 %로 잡을 수 없음. vw는 가능! https://marshall-ku.com/web/tips/css-grid%EB%A1%9C-masonry-%EB%A0%88%EC%9D%B4%EC%95%84%EC%9B%83-%EB%A7%8C%EB%93%A4%EA%B8%B0 CSS Grid로 Masonry 레이아웃 만들기 grid-template-..

ios 에는 autoplay 말고 playsinline로 적용가능하다 위를 적용하면 아래처럼 쓸 수 있다

https://codepen.io/parkjubal/pen/bGrKzjX bGrKzjX ... codepen.io header에 호버하면 bg가 바뀌고 nav에 호버해야 2뎁스 메뉴가 보이는 구조

/* 모바일에서도 PC화면처럼 보임 */ /* 반응형 */ /* 네이버나 구글에 홈페이지 검색시 나오는 설명문을 이렇게 설정할 수 있다. */ /* 그림위에 마우스 오버시 이미지 관련 툴바가 생기지 않도록 정의 */ /* 인터넷 익스플로러 최신버전으로 랜더링한 후 문서열림 */ /* 파비콘 설정 */ head에 들어가는 메타태그와 파비콘코드

* {margin:0; padding:0; outline:none !important; } h1,h2,h3,h4,h5,h6,p,a,button,span,strong,ul,li,td,th,div,input,textarea { font-family:; } ol, ul, li { list-style: none; } a { color:#000; text-decoration:none; transition:all .3s; } button { outline:none; background:none; border:0; cursor:pointer; } table{ width:100%; border-collapse:collapse; } .inner { max-width:; margin:0 auto; } /* 서브 컨텐츠용 ..

꼭 텍스트이미지가 아닌 다른것이어도 응용할 수 있을거 같다 ex) 물결이 치는듯한 이미지. width값이 길어야 할듯

햄버거메뉴나 레이어팝업이 활성화되면 body에 특정클래스(overflow:hidden을 넣은)를 추가하거나 body에 자체적으로 overflow:hidden을 넣으면 된다 이는 컨텐츠 외 영역을 클릭했을 때 팝업이 닫히거나 햄버거 메뉴가 닫히는 스크립트와 함께 쓰면 좋을듯 하다

얌전한 홈페이지를 만들면 안될까요

$(클래스).이벤트(function(){ },function(){ }) 이런 형식의 스크립트는 어떻게 해석하는걸까 호버상태면 함수1 실행, 호버상태가 아니면 함수2 실행?