const swiper = new Swiper('.swiper-container', { a11y: { prevSlideMessage: 'Previous slide', nextSlideMessage: 'Next slide', }, }); swiperjs.com/swiper-api#accessibility-a11y Swiper API Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. swiperjs.com
@content가 포함된 영역이 스타일 블록이 된다. 이 방식을 사용하여 기존 Mixin이 가지고 있는 기능에 선택자나 속성 등을 추가할 수 있다. @mixin icon($url) { &::after { display: block; content: $url; @content; } } .icon1 { @include icon("/images/icon.png"); } .icon2 { @include icon("/images/icon.png") { position: absolute; }; } .icon1::after { display: block; content: "/images/icon.png"; } .icon2::after { display: block; content: "/images/icon.png";..
mill-study.tistory.com/207#question-1 [Do it! 자바스크립트 기본] 08. 웹 문서를 다루는 방법, 문서 객체 모델(DOM) - 상세 설명 보기/닫기 ( 에디오피아 게뎁 상품명 : 에디오피아 게뎁 판매가 : 9,000원 배송비 : 3,000원 (50,000원 이상 구매 시 무료) 적립금 : 180원(2%) 로스팅 : 2019.06.17 장바구니 담기 상세 설명 보기 상품 상세 정보 원산지 : mill-study.tistory.com
에디오피아 게뎁 상품명 : 에디오피아 게뎁 판매가 : 9,000원 배송비 : 3,000원 (50,000원 이상 구매 시 무료) 적립금 : 180원(2%) 로스팅 : 2019.06.17 장바구니 담기 상세 설명 보기 상품 상세 정보 원산지 : 에디오피아 지 역 : 이르가체프 코체레 농 장 : 게뎁 고 도 : 1,950 ~ 2,000 m 품 종 : 지역 토착종 가공법 : 워시드 Information 2차 세계대전 이후 설립된 게뎁 농장은 유기농 인증 농장으로 여성의 고용 창출과 지역사회 발전에 기여하며 3대째 이어져 내려오는 오랜 역사를 가진 농장입니다. 게뎁 농장은 SCAA 인증을 받은 커피 품질관리 실험실을 갖추고 있어 철처한 관리를 통해 스페셜티 커피를 생산합니다. Flavor Note 은은하고 다채로..
피드백 프로그램 작성 순서를 구체적으로 계획을 짜고 코드를 짜도록 하자. 함수는 재활용을 하기 위해서 분리 작업을 하자. 유동성 있는 코드를 사용하자. (this, elem의 속성) 코드 수정 수정 전 const smallImg = document.querySelectorAll('.small'); smallImg.forEach(function (elem) { elem.onclick = function() { const elemSrc = elem.getAttribute('src'); const bigChange = elem.parentElement.previousElementSibling; bigChange.setAttribute('src', elemSrc); } }); 1차. 함수 재활용을 위한 함수 분..
부모 구분 속성 기본값 축약 방향 flex-direction row flex-flow *값의 위치는 제약이 없다. [예제] flex-flow: cloumn wrap flex-flow: wrap cloumn 줄바꿈 flex-wrap nowrap 정렬 justify-content normal place-content [값이 1개인 경우] place-content: align-content | justify-content *align, justify 값이 동일하게 적용 [값이 2개인 경우] place-content: align-content justify-content *띄어쓰기로 값을 구분한다. [예제] gap: center gap: 8px 16px align-content normal align-items..
justify-content는 그룹으로만 항목을 처리하기 때문에 justify-items. justify-self 속성이 없다. (보통 align-iems와 함께 사용하다보니, justify-content가 item을 정렬하는 것으로 오해를 많이 한다.) 그렇다면 justify-self를 사용하지 않고, 단독 정렬은 어떻게 해야할까? 정렬할 대상에 margin-방향: auto를 사용한다. See the Pen [CSS3] flex의 justify-self처럼 단독으로 정렬하는 방법 by mill (@millfeel) on CodePen.
- Total
- Today
- Yesterday
- outerHeight
- scrollTop
- clinetTop
- 점 표기법
- @font-face
- scrollHeight
- javascript class
- clientHeight
- innerHeight
- prototype 프로퍼티
- 대괄포 표기법
- 프로퍼티
- offsetHeight
- [[Prototype]]
- __proto__
- 부등 연산자
- 링크막기 #a링크막기
- offsetTop
- constructor
- 일치 연산자
- property
- 동치 연산자
- 객체의 프로퍼티
- 불일치 연산자
- 동등 연산자
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 | 31 |