map.css 적용이 안됩니다.
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요!
- 먼저 유사한 질문이 있었는지 검색해보세요.
- 서로 예의를 지키며 존중하는 문화를 만들어가요.
- 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
map.css를 작성했는데 이것을 주석처리하든 안하든 liveserver에는 똑같이 뜹니다.
혹시 index.html에 무엇을 연결해놔야 하나요? 인강을 다시 돌려보았는데 놓친 부분이 있는 것 같습니다...
index.html입니다.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>이파리 지도</title> <meta name="author" content="이파리" /> <meta name="description" content="병행충 생태 지도 서비스" /> <meta name="keywords" content="병해충, 이파리, 관찰, 식물, 지도" /> <link rel="stylesheet" href="style.css" /> </head> <body> <nav> <div class="inner"> <div class="nav-container"> <h1 class="nav-title">이파리 지도</h1> <button class="nav-contact">사이트 이동</button> </div> </div> </nav> <main> <section id="category"> <div class="inner"> <div class="category-container"> <h2 class="category-title">이파리 카테고리를 선택해보세요</h2> <div class="category-list"> <button class="category-item">빨강</button ><button class="category-item">주황</button ><button class="category-item">레몬</button ><button class="category-item">연갈색</button ><button class="category-item">검정</button ><button class="category-item">흰색</button ><button class="category-item">선</button ><button class="category-item">점</button> </div> </div> </div> </section> <!-- 카테고리 --> <div id="map" class="inner"></div> <!--카카오지도 --> </main> <div class="infowindow"> <div class="infowindow-img-container"> <!-- <img src="https://i0.wp.com/ipari.kr/wp-content/uploads/2022/10/red_lesion-scaled.jpg?zoom=2&resize=300%2C300&ssl=1" class="infowindow-img"> --> </div> <div class="infowindow-body"> <h5 class="infowindow-title">할머니집</h5> <p class="infowindow-address">서울특별시 중구 명동3길 42</p> <a href="" class="infowindow-btn" target="_blank"></a> </div> </div> <script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=7e75aa2606436f7d03f3b0bbd72c8a5e&libraries=services"></script> <script src="script.js"></script> </body> </html>/
2.map.css입니다.
인포윈도우 설정
.infowindow {
width:25rem;
border: 1px solid black;
border-radius: 5px;
background-color: white;
}
.infowindow-img-container {
width: 100%;
overflow: hidden;
}
.infowindow-img {
width: 100%;
}
.infowindow-title{
font-size: 2rem;
}
.infowindow-address {
font-size: 1.6rem;
}
.infowindow.btn {
font-size: 1.6rem;
}
답변 1
1
안녕하세요.
html head tag 내부에 link태그를 이용해 map.css 파일을 연결해주시면 될 것 같습니다. style.css를 연결한 것 처럼요!
감사합니다.
live server가 안 떠요..
0
99
1
카카오맵 API 가 안뜹니다...
0
759
2
카카오맵API 지도 관련
0
184
1
Putty에서 nginx를 vi로 수정할때 오류
0
304
3
mysql과 선생님의 깃허브 코드연결
0
198
1
nodemon 실행오류
0
244
2
Azure 서버로 구축하고 작업하는 방법 알 수 있을까요?
0
281
2
css 적용 중 강의대로 적용되지 않아 질문 드립니다
0
362
2
강의를 잘 활용하는 법 추천 부탁드립니다.
0
293
1
MysqlWorkbench 접속문제
0
313
1
전체 핀이 조회되지 않습니다.
0
270
1
빅데이터 처리관련
1
291
1
섹션5의 2번째 강의 질문-setMap 비동기 처리 이유
0
245
1
PM2 EADDRINUSE 에러
0
416
2
인스턴스 중단 후 재시작
0
292
1
이미지 부분에 cctv 영상을 넣고 싶은데요.
0
596
2
노션 링크가 어디있나요 ?
1
318
1
axios 이후 마커 오류
0
295
0
service nginx restart 에러
0
722
1
섹션10 배포하기 unbuntu에서 root경로가 안뜹니다ㅠㅠ
0
519
3
선생님 추가적으로 새로운 페이지를 만드려고 하는데요...
0
252
1
코드 질문 드립니다!
0
237
1
혹시 강의자료 노션 내리셨나요?
0
244
1
노드몬 에러 참조하세요
0
364
1





