HTML 라디오광고·방송광고 광고음악·로고송 교가·시가 성우녹음·더빙 사운드디자인·음향 CSS #portfolio ul.title li.hover { background-color: #ccc; transition: all .2s; } jQuery $('.title li').on('click', function(){ $('.title').find(".hover").removeClass('hover'); $(this).addClass('hover'); }); .find()는 하위 요소를 찾으므로 li의 '.hover'을 찾기 위해서는 그의 부모요소인 '.title'에 적용해야 한다. 적용예시 +)클릭한 요소에 관련된 요소만 보여지게 하는 방법 (2개) HTML 추천인 아이디 참여 이벤트명 확인 참여 이벤트 ..

Myongji Hospital Seoul Healthcare Hub 슬라이드 영역의 텍스트(컨텐츠)를 p tag 등으로 감싼 후 .swiper-slide p { width: 70%; background-color: var(--whoz-color); text-align: center; color: #fff; padding: 14px 0; border-radius: 15px; cursor: pointer; margin: 0 auto; } 컨텐츠의 원하는 너비값을 준 후 margin: 0 auto; 를 주면 화살표버튼과 겹치지 않고 내용만 중앙정렬 할 수 있다

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 /* 5, 10, 15, 20 번째 선택 (5의배수) */ .box:nth-child(5n){} /* 8번 부터 이후 모든 box 선택 */ .box:nth-child(n+8) {} /* 1번째 부터 8번째 까지 선택 */ .box:nth-child(-n+8) {} /* 16번째 부터 19번째 까지 box 배경색 변경 */ .box:nth-child(n+16):nth-child(-n+19) {} /* 마지막(20)에서 부터 3번째 */ .box:nth-last-child(3) {} /*nth-last-child(n)는 마지막에서부터 순서를 계산 .box:nth-child(odd) { color: red; } /* ..

HTML Slide 1 Slide 2 Slide 3 JS var swiper = new Swiper(".mySwiper", { slidesPerView: 2, // 보여질 슬라이드 개수 spaceBetween: 17, // 슬라이드 사이의 거리 centeredSlides: false, // 중앙부터 시작할지 여부 slidesOffsetBefore : number, // 슬라이드 시작 부분 여백 navigation: { // 스와이프 화살표 추가 nextEl: ".swiper-button-next", prevEl: ".swiper-button-prev", }, pagination: { // 페이지네이션 추가 el: ".swiper-pagination", type: "fraction", // 타입 숫자 ex..

원 .wrap{ position:relative; display : inline-block; } .wrap input{ width:240px; height:30px; border:1px solid #aaa; border-radius:4px; text-align:right; box-sizing:border-box; } input:not(:placeholder-shown){ /* input박스에 placeholder가 사라졌을 때 (=내용이 입력됐을 때) */ padding-right:24px; } input:not(:placeholder-shown) +span{ display:block; } .wrap span{ /* span의 위치를 잡아준 뒤 display:none */ position: absolut..

명지병원 서울헬스케어허브 바른몸의원 심포니셀의원 part0의 내용 .mySwiper { margin-bottom: 25px; } .swiper-slide { background-color: pink; text-align: center; color: #fff; padding: 14px 0; border-radius: 15px; } .swiper-pagination { display: none; } // Section 08_partners(PC) let tab = $('#partners .p_left ul').find('li'); function tab_menu(num){ for(let i=0;i