HTML과 CSS 만으로는 이를 구현하기가 어렵습니다. JavaScript를 사용하여 클릭 이벤트를 처리하고 누적 횟수를 표시하는 것이 가장 간단한 방법입니다.

아래는 간단한 예시 코드입니다. 카드에는 "buy-btn" 클래스를 추가하고, 해당 클래스를 갖는 모든 요소에 대해 클릭 이벤트를 등록합니다. 클릭할 때마다 "count" 변수를 증가시키고, 해당 값을 "count-badge" 클래스를 갖는 요소에 반영합니다.

.html
<div class="card h-100"> ... <div class="card-body"> ... <button class="btn btn-primary buy-btn">구매희망</button> <span class="badge bg-secondary count-badge">0</span> </div> </div>


자바 스크립트
let count = 0; const buyButtons = document.querySelectorAll('.buy-btn'); const countBadge = document.querySelector('.count-badge'); buyButtons.forEach(btn => { btn.addEventListener('click', () => { count++; countBadge.textContent = count; }); });

위 코드에서는 count 변수를 0으로 초기화하고, 'buy-btnbuy-btn 클래스를 갖는 모든 요소에 대해 클릭 이벤트를 등록합니다. 클릭할 때마다 count 값을 1 증가시키고, 해당 값을 count-badge 클래스를 갖는 요소의 내용으로 반영합니다. 이렇게 하면 각 카드에 대해 따로 누적 횟수를 계산하게 됩니다.

---------------------------------------------------

라고 나왔어요 와~@@신세계인 것 같아요~!! 그런데 어디에 넣어야 할지 모르겠어요~;;