뇌 채우기 공간

const colors = `hsl(${parseInt(Math.random() * 24, 10) * 15}, 16%, 57%)`; 참고 : 이것은 vue 코드 hsl에서 hue만 랜덤으로 돌리는 방법 그러면 톤이 똑같고 색상만 랜덤으로 추출됨

https://www.w3schools.com/jsref/met_win_confirm.asp Window confirm() Method W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more. www.w3schools.com 뭔가를 삭제하기 전에 삭제 하시겠습니까? 해서 네 하면 삭제되고 아니오 하면 삭제 안되고 하는 것을 구현하고 싶었다. 이걸 커스텀 모달을 만들어서 구현해야하는지 고민했는데 Window.con..

https://www.gradient-animator.com/ CSS Gradient Animator A CSS generator to create beautiful animated gradients for use on your website. www.gradient-animator.com 스켈레톤으로 그라데이션이 움직이는 css를 만들고 싶어서 찾아보다가 발견한 사이트! 자동으로 애니메이션 코드를 생성해준다!

보호되어 있는 글입니다.

detail.html 상세페이지 메인으로 돌아가기 index.html 메인 페이지 상세 페이지로 가기

.video{ max-width: 650px; border: 4px solid red; } .video-ratio{ height: 0; /* padding top은 부모 요소의 가로 요소에 영향을 받는다 */ /* height는 반응형이 안되고 크기를 픽스해버리는 것임 */ padding-top: 56.25%; position: relative; } iframe{ background: black; position: absolute; top:0; left: 0; width: 100%; height: 100%; } padding-top 에 56.25퍼센트는 16:9를 계산해서 나온 수치임 그것이 padding이기 때문에 그 안에 요소가 들어갈 수 없다. 그러므로 iframe에 position : absolu..

width값을 디바이스의 크기로 하겠다, 처음 크기를 확대 축소 없이 1배율로 하겠다. 사용자가 손이나 뭣으로 확대축소를 할 수 있냐? no 최대 크기를 1 최소 크기를 1로 한다.

2021.04.19 - [WEB/html,CSS] - [html][css] grid 에 대해서 / display /grid-template-rows/ grid-template-columns/grid-column/gird-template-areas/gap(grid-row-gap) [html][css] grid 에 대해서 / display /grid-template-rows/ grid-template-columns/grid-column/gird-template-areas/gap(grid-ro display grid container을 정의한다. 그리드를 사용하기 위해 필수적이다. 1 2 3 1 2 3 .container{ display: grid; width:300px; height:250px; border..

display grid container을 정의한다. 그리드를 사용하기 위해 필수적이다. 1 2 3 1 2 3 .container{ display: grid; width:300px; height:250px; border: 4px solid lightgray; } .item{ border: 2px dashed red; } display: grid;는 블럭요소같은 grid를 만드는 것이다. display: inline-grid; container의 css를 이렇게 바꾸면 inline요소 같은 grid가 만들어진다. grid-template-rows 행이 몇개인지 정의하는 것 grid-template-columns 열이 몇개인지 정의하는 것 1 2 3 .container{ display: grid; grid-..