https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_popover&stacked=h
<script src="<https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js>"></script>
<link href="<https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css>" rel="stylesheet" integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous">
<script src="<https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js>" integrity="sha384-pprn3073KE6tl6bjs2QrFaJGz5/SUsLqktiwsUTF55Jfv3qYSDhgCecCxMW52nD2" crossorigin="anonymous"></script>
<link rel="stylesheet" href="<https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,[email protected],100..700,0..1,-50..200>" />
<script>
$(function(){
$('[data-bs-toggle="popover"]').popover();
});
</script>
<!-- data-bs-html 속성으로 data-content 내부에서 html태그 활성화 -->
<label data-bs-toggle="popover" data-bs-placement="top" data-bs-html="true" data-bs-trigger="focus" tabindex="0"
data-bs-content="기본 배송비 2,500원 <br/> 50,000원 이상 구매 시 무료배송">
<span id="deliIcon" class="material-symbols-outlined">help</span>
</label>