인프런 커뮤니티 질문&답변
작성한 질문수
브라우져 호환성 문의
작성
·
27
·
수정됨
0
⚠질문 작성법
- 몇 섹션의 어떠한 강의에 대한 질문인지 작성해주세요. (ex. 섹션2 조건문에 대한 질문)
- 질문은 최대한 구체적으로 작성해주세요.
- 비슷한 질문이 올라와있는지 확인해주세요.
- 코드가 포함된 질문은 아래와 같이 코드블록을 사용해주세요.
console.log("hello world");
안내사항
- 질문에 대한 답변은 보통 주말, 공휴일을 제외한 평일 오전 시간에 답변해드립니다.
- '질문 해결'은 답변 작성일 기준 1일 이후에 설정됩니다.
추가: 아래 환경 외에도 윈도우 크롬브라우져 환경에서도 폰트관련 css등이 전혀 동작하지 않고 있습니다. 확인 바랍니다.
==========================
섹션7 33.[안내] 프로젝트 코드 주소 에서
소스 다운받고 index.html파일을 Linux firefox브라우져에서 열어보면 제대로 표시되지 않습니다. 브라우져상관 없이 정상 실행 되도록 하려면 어떻게 해야 하나요?
답변 2
0
안녕하세요 crk1004님 🙂 질문 감사합니다.
본 강의는 크롬 브라우저를 사용하는 강의로, 되도록 크롬 브라우저를 사용하시는걸 권장드립니다!
강의의 내용과 같이 VSCode의 Live Server 확장 프로그램을 사용해 코드를 열어보시거나, node 설치 후 로컬 서버로 열어보시는 것을 추천드립니다.
그럼에도 문제가 발생한다면, 다시 질문 남겨주세요! 감사합니다.
섹션 3. 자바스크립트 시작하기-6.[최신버전] 자바스크립트 코딩 환경 설정 강의를 수강해보시면, Live Server 서버에 대한 내용을 다루는 것을 알 수 있는데요, Live Server 확장 프로그램을 사용하시면 프로그램으로 작성한 코드에 대한 결과를 웹 화면에서 실시간으로 확인할 수 있습니다.
소스를 다운 받고 index.html 파일을 열어보셨다고 하셔서, Live Server나 node 등을 활용해, 코드 전체를 열어보시는 것을 추천드린다는 말이였습니다!
-1
안녕하세요, 인프런 AI 인턴입니다.
crk1004님께서 제기하신 문제인 브라우저 호환성 부분에 대해서 몇 가지 방법을 추천드릴 수 있습니다. 자바스크립트 및 CSS가 여러 브라우저 환경에서 동일하게 동작하도록 하려면 다음을 고려해볼 수 있습니다:
브라우저 호환성 체크: 여러 브라우저에서 CSS 및 자바스크립트 지원 상황이 다를 수 있습니다. 다양한 브라우저에서의 지원 여부를 체크할 수 있는 도구나 사이트를 활용해 보세요. 예를 들어, Can I use 같은 사이트에서 브라우저 별로 특정 CSS 속성이나 자바스크립트 기능의 지원 여부를 확인할 수 있습니다.
폴리필 사용: 최신 자바스크립트 기능을 사용하고자 할 때, 일부 구형 브라우저에서는 지원하지 않을 수 있습니다. 이런 경우 폴리필(Polyfill) 라이브러리를 사용하여 구형 브라우저에서도 최신 기능을 사용할 수 있도록 해줍니다.
CSS 리셋/노말라이즈: 브라우저마다 기본 CSS 스타일이 상이하게 적용될 수 있습니다. 이를 방지하기 위해 CSS 리셋(Reset)이나 노말라이즈(Normalize.css)를 사용하여 스타일을 일관되게 적용할 수 있습니다.
벤더 프리픽스 사용: CSS의 특정 속성들은 브라우저 제조사별로 미리보기 형태로 구현된 경우가 있습니다. 이 경우 각 브라우저 벤더 프리픽스를 사용해 보세요. 예를 들어,
-webkit-,-moz-,-o-등이 있습니다.개발자 도구 활용: 브라우저의 개발자 도구를 사용하여 콘솔에서 렌더링 문제를 확인하고 각각의 요소들이 어떻게 렌더링되고 있는지를 분석해 보세요.
이러한 방법을 통해 문제를 해결해보실 수 있습니다. 그래도 문제가 지속된다면, 구체적인 코드 및 에러 메시지를 제공해 주신다면 더 상세한 조언을 드릴 수 있습니다. 추가로, 크롬 브라우저에서는 확장 프로그램 및 하드웨어 가속과 관련하여 문제가 발생할 수 있으므로, 위의 설명을 참조하여 설정을 확인해보세요.
추가적인 도움이 필요하시면 언제든지 문의 주세요.
감사합니다.
VSCode Live Server/node설치 필요한 이유가 프로젝트 소스중 어떤 내용 때문인가요?