분류 전체보기301 Smooth Scrolling(제이쿼리 플그인, css속성) jQuery 플러그인: [ jquery.scrollTo.min.js ] html {scroll-behavior: smooth;} ** IE에서 적용 안된다. 속도를 조절할 수 없다. ----------------------------------------------------------------------------------------------------------------------------------- https://www.youtube.com/watch?v=vh5hDOjeVvk&t=982s KEYWORDS: index() / eq() / offset(), top / animate({scrollTop: }) / scrollTop() / each() / $(window).scroll(funct.. 2020. 8. 1. Accordion 기능 (jQuery) https://webclub.tistory.com/100 이게 뭔가요? 나도 몰라... 질문입니다... Lorem ipsum dolor sit amet, consectetur adipisicing elit. Earum maiores. ----------------------------------------------------------------------------------------------------------------------------------- * { margin: 0; padding: 0; } dl { } dt, dd { padding: 10px; } dt { background-color: #cfc; margin-bottom: 5px; } dt span { display: inl.. 2020. 7. 29. select box 1. select 화살표 지우기: select{appearance: none; -webkit-appearance: none;} select::-ms-expand{opacity: 0;} 2020. 7. 21. relative와 margin의 차이점에 대해서 position: relative는 position: absolute의 좌표가되는 기준점이 되기도 하지만. 스스로를 기준삼아 레이아웃을 해치지 않고 이동할 수 있기도 하다. margin은 다른 요소들의 레이아웃에 영햘을 준다. https://www.youtube.com/watch?v=O92E-48QkoQ&list=PL_6yF2upGJYtmmrp2RIvzjT33dmW9cSwP&index=41&t=0s 2020. 7. 20. margin:0 auto와 text-align:center의 차이점에 대해서 text 인라인요소 인라인 요소인 span(인라인요소)을 정렬시키기 위해서는 (블록요소의)부모에게 text-align: center;를 주면 된다. 링크 a요소에 text-align: center;를 줄 경우 먹히지 않는다. 대신 아래와 같이 블록요소 p안에 a를 배치할 경우 가운데 정렬이 가능하다. 링크 아래 div를 가운데 정렬시키기 위해서는 margin: 0 auto;값을 주어야 하는데, 반드시 width(너비)값이 있어야 한다. 블럭요소 https://www.youtube.com/watch?v=_Uat6POnKiA&list=PL_6yF2upGJYtmmrp2RIvzjT33dmW9cSwP&index=40&t=0s 2020. 7. 20. CSS tip 1. 소수점 표기법: css값 마지막은 세미콜론을 안넣어도 된다. ;} → } 2. 마진 곂침현상: 큰수가 먼저 표현된다. 여백은 한방향으로 준다. margin보단 padding. div{margin-bottom: 10px;} div{margin-top: 10px:} 결과: 10px만큼의 여백이 생긴다. (20px이 아니다.) div{margin-bottom: 20px;} div{margin-top: 10px:} 결과: 20px만큼의 여백이 생긴다. (30px이 아니다.) 3. Padding과 maring의 우선 순위: 무조건 padding을 준다. 하지만 배경에 색/이미지/선(border)이 있을 경우 margin을 준다.(위의 더블마진현상을 방지하기 위해) 4. 높이 100%: 첫번째 방법: posi.. 2020. 7. 20. 이전 1 ··· 46 47 48 49 50 51 다음