본문 바로가기

분류 전체보기35

grid masonry 일정하지 않은 비율을 가져올떄 사용 *부모 grid-template-columns: repeat(3, 1fr); /* 3칸 */ grid-template-rows: repeat(4, 1fr); /* 4줄 */ *자식grid-column: span 3; /* 3칸을 차지하겠다 */grid-row: span 2; /* 2줄을 차지하겠다 */   See the Pen CSS Grid by uni (@agosto) on CodePen. 2024. 5. 27.
에니메이션 라이브러리 Velocity.js http://velocityjs.org/mo.js https://mojs.github.io/anime.js  https://animejs.com/ 2024. 5. 18.
css로 마스크 입히는법 (들어가는 이미지 크기가 일정하지 않은 비율일때) 1. 이미지를 백그라운드로 넣었을때 => 이미지 크기 꽉차게 2. 이미지 태그로 넣었을때 => 이미지가 마스크 이미지에 맞게 찌그러진다  https://codepen.io/SitePoint/pen/YqByJGSee the Pen mask by uni (@agosto) on CodePen. 2024. 5. 16.
flex 말줄임 width값 못잡을때? / flex gap 자식들 간격 어떻게? 1. flex-shrink, flex-grow의 쓰임새?난 쪼그라 들지 않겠다!!! => flex-shrink: 0;여백이 남으면 그 남은 여백을 가지겠다 => flex-grow: 1;아이콘같은 거는 위드값이 줄어도 크기가 안쪼그라 들어야해서 flex-shrink를 써야하고위드값이 100%에서 자식들이 25%가 3개가 있을때 오른쪽에 나머지 여백이 남는다 그러면 그 여백을 자식들이 가질려면 flex-grow: 1; 을 써주면된다  2. 말줄임표 줄때 위드값이 벗어나면?말줄임을 주는 놈에게 => width:100%; min-width:0;말줄임을 주는 부모에게 => width: 100%; (위드값이 있어야함!!)말줄임을 주는 부모의 부모에게 => width: 100% (위드값이 있어야함!!)부모가 인라인으.. 2024. 5. 11.
인풋 체크박스, 라디오 공통 만들기, 주민등록번호 앞자리 1. 라벨안에 인풋을 넣으면?인풋, 라벨 아이디를 안맞쳐도 된다!!!https://www.w3schools.com/howto/howto_css_custom_checkbox.asp How To Create a Custom Checkbox and Radio ButtonsW3Schools 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 2. 체크박스하나있는데 라벨에 들어가는 내용이 많다? 스크립트.. 2024. 5. 11.
테이블 보더 왼쪽없을때 테이블 보더 왼쪽없을때&[rowspan] {border-left:none;} 2017. 7. 26.

티스토리툴바