svg가 로드된 html 파일에서 안보임

svg가 로드된 html 파일에서 안보임 채택완료

index.html 파일안에서 제이쿼리를 이용해서 푸터를 html 에 불러왔습니다.

그런데 index.html 안에 푸터에 들어갈 내용을 쓰면

li 4개가 잘 보이고 svg 로드도 잘되는데

불러오는 html 안에선 li가 2개밖에 안보이고 정상적으로 로드도 안됩니다.

혹시 왜 그러는지 알수 있을까요?ㅠ

헤매고 있습니다.

3552902211_1654568437.607.png

Copy

<!--index.html 파일 안에서 푸터 불러오기-->

<div id="mfooter" class="only_m"></div>

 

    <!-- html 에서 공통 header, footer 불러오기(서버로 가면 삭제 가능)-->

    <script>

        $(document).ready( function() {

            $('#mfooter').load('./jy_footer_m.html');

        })

    </script>

Copy

<div class="m_footer only_m">

    <ul>

        <li>

            <a href="">

                <svg width="24" height="25" viewBox="0 0 24 25" fill="none">

                    <path d="M20.85 9.60001V23.5H3.15002V9.60001" stroke="#F08600" stroke-miterlimit="10"

                        stroke-linecap="round" stroke-linejoin="round" />

                    <path d="M1.25 11L12 1.5L22.75 11" stroke="#F08600" stroke-miterlimit="10" stroke-linecap="round"

                        stroke-linejoin="round" />

                    <path d="M14.7 17.95H9.30005V23.5H14.7V17.95Z" stroke="#F08600" stroke-miterlimit="10"

                        stroke-linecap="round" stroke-linejoin="round" />

                </svg>

                <p>홈</p>

            </a>

        </li>

 

        <li>

            <a href="">

                <svg width="24" height="25" viewBox="0 0 24 25" fill="none">

                    <path d="M20.85 9.60001V23.5H3.15002V9.60001" stroke="#F08600" stroke-miterlimit="10"

                        stroke-linecap="round" stroke-linejoin="round" />

                    <path d="M1.25 11L12 1.5L22.75 11" stroke="#F08600" stroke-miterlimit="10" stroke-linecap="round"

                        stroke-linejoin="round" />

                    <path d="M14.7 17.95H9.30005V23.5H14.7V17.95Z" stroke="#F08600" stroke-miterlimit="10"

                        stroke-linecap="round" stroke-linejoin="round" />

                </svg>

                <p>홈</p>

            </a>

        </li>

 

        <li>

            <a href="">

                <svg width="24" height="25" viewBox="0 0 24 25" fill="none">

                    <path d="M20.85 9.60001V23.5H3.15002V9.60001" stroke="#F08600" stroke-miterlimit="10"

                        stroke-linecap="round" stroke-linejoin="round" />

                    <path d="M1.25 11L12 1.5L22.75 11" stroke="#F08600" stroke-miterlimit="10" stroke-linecap="round"

                        stroke-linejoin="round" />

                    <path d="M14.7 17.95H9.30005V23.5H14.7V17.95Z" stroke="#F08600" stroke-miterlimit="10"

                        stroke-linecap="round" stroke-linejoin="round" />

                </svg>

                <p>홈</p>

            </a>

        </li>

       

        <li>

            <a href="">

                <svg width="24" height="25" viewBox="0 0 24 25" fill="none">

                    <path d="M20.85 9.60001V23.5H3.15002V9.60001" stroke="#F08600" stroke-miterlimit="10"

                        stroke-linecap="round" stroke-linejoin="round" />

                    <path d="M1.25 11L12 1.5L22.75 11" stroke="#F08600" stroke-miterlimit="10" stroke-linecap="round"

                        stroke-linejoin="round" />

                    <path d="M14.7 17.95H9.30005V23.5H14.7V17.95Z" stroke="#F08600" stroke-miterlimit="10"

                        stroke-linecap="round" stroke-linejoin="round" />

                </svg>

                <p>홈</p>

            </a>

        </li>


 

    </ul>

</div>

svg가 로드된 html 파일에서 안보임 채택완료

답변 1개

공유하기