Freecodecamp: Lobster 글꼴 모음에 대한 링크를 주석 처리하면 올바르게 렌더링되지 않습니다.

에 만든 2016년 04월 10일 · 15코멘트 · 출처: freeCodeCamp/freeCodeCamp

도전 이름

글꼴 저하 방법 지정

https://www.freecodecamp.com/challenges/specify-how-fonts-should-degrade

문제 설명

이 문제는 googleapis.com에서 Lobster 글꼴 패밀리에 대한 링크를 주석 처리 할 때 발생합니다. 재현하려면 해당 코드 줄을 주석 처리하고 성능이 저하되는지 확인하십시오.

브라우저 정보

브라우저 이름, 버전 : Chromium 버전 49.0.2623.110 (64 비트)
운영 체제 : Linux 4.4.6_1 Void Linux (64 비트)
모바일, 데스크톱 또는 태블릿 : 데스크톱

귀하의 코드

<!--
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
-->
<style>
  .red-text {
    color: red;
  }

  h2 {
    font-family:  Monospace;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

스크린 샷

Exsample code removed #1
Exsample code removed #2
Monospace Removed

help wanted

출처

Arzte

👍2

가장 유용한 댓글

나는 똑같은 것을 보았고 그것이 버그라고 생각했습니다. 예상되는 동작이기 때문에 실제로 문제는 아니지만 혼란 스럽습니다.

간단한 "해결책"은 도전에 대한 설명을 추가하는 것입니다. 이 라인을 따라 뭔가 :

노트
컴퓨터에 Lobster 글꼴이 설치되어있는 경우 브라우저에서 글꼴을 찾을 수 있기 때문에 성능 저하가 나타나지 않습니다.

이 작업에 대한 참고 사항과 유사합니다.
https://www.freecodecamp.com/challenges/change-the-font-size-of-an-element

그렇게하면 사람들이 이것을 볼 때 무슨 일이 일어나고 있는지 이해할 것입니다.

nschulzke 에 2016년 07월 10일

👍3

모든 15 댓글

@TheDoctorsLife 나는 이것을 재현 할 수 없습니다.

@ FreeCodeCamp / issue-moderators 왜 이런 일이 발생하는지에 대한 아이디어가 있습니까?

erictleung 에 2016년 04월 10일

이전에 이미이 도전을 통과했을 가능성이 있습니까? 내 모든 설정에서 잘 작동하는 것 같습니다.

caravinci 에 2016년 04월 10일

이 문제는 내가 통과하기 전에 보여졌지만 나중에보고 할 수 있도록 다시 돌아갔습니다.

Arzte 에 2016년 04월 10일

@TheDoctorsLife 시크릿 모드에서이 도전을 시도하고 여전히 지속되는지 확인할 수 있습니까? 여기서 범인이되는 네트워크를 제거하고 싶습니다. 나도 번식 할 수없는 것 같습니다.

raisedadead 에 2016년 04월 11일

크롬과 사파리에서 똑같은 오류가 발생합니다. 링크를 주석 처리 한 후에도 Lobster 글꼴을 유지합니다. 시크릿 모드에서도 시도했지만 동일한 결과를 얻었습니다.
screen shot 2016-04-11 at 11 00 26 am

jaytaix 에 2016년 04월 11일

👍1

Chrome Canary :이 문제가 발생하지 않습니다.

mattdbr 에 2016년 04월 12일

👍1

시스템에 해당 글꼴이 설치되어있을 수도 있습니까? 트윗 담아 가기

caravinci 에 2016년 04월 18일

👍1

시스템에 해당 글꼴이 설치되어있을 수도 있습니까? 트윗 담아 가기

내 시스템에 있습니다. 나는 그것이 사실이라고 생각하고 있었는데 ... 그 원인을 정확히 알지 못해서 짜증이 났지만 글꼴을 비활성화하면 사라집니다. 따라서 지금까지 두 가지 솔루션은 Chrome 업데이트 및 / 또는 로컬에서 Lobster를 사용하지 않도록 설정하는 것입니다.

jaytaix 에 2016년 04월 18일

@jaytaix 나는 그것이 그것으로

삶의 사실. 별로 도와 드릴 수 없어서 죄송합니다. 그러나 이것은 우리 사이트의 범위를 벗어납니다. 누군가 그것을 다시 열 필요가 있다고 느끼지 않는 한, 나는이 문제가 종결 된 것으로 간주합니다 (기술적으로 "해결 된"것은 아닙니다. 알아요 ...)

caravinci 에 2016년 04월 18일

나는 똑같은 것을 보았고 그것이 버그라고 생각했습니다. 예상되는 동작이기 때문에 실제로 문제는 아니지만 혼란 스럽습니다.

간단한 "해결책"은 도전에 대한 설명을 추가하는 것입니다. 이 라인을 따라 뭔가 :

노트
컴퓨터에 Lobster 글꼴이 설치되어있는 경우 브라우저에서 글꼴을 찾을 수 있기 때문에 성능 저하가 나타나지 않습니다.

이 작업에 대한 참고 사항과 유사합니다.
https://www.freecodecamp.com/challenges/change-the-font-size-of-an-element

그렇게하면 사람들이 이것을 볼 때 무슨 일이 일어나고 있는지 이해할 것입니다.

nschulzke 에 2016년 07월 10일

👍3

@Lolinder 의 제안 노트를 좋아합니다.

erictleung 에 2016년 07월 10일

포크의 브랜치에 영어와 스페인어로 메모를 추가했지만 풀 요청을 제출하기 전에 npm을 실행하기위한 모든 설정이 아직 설정되지 않았습니다. 아무도 나를 이기지 않으면 월요일에 이것으로 돌아갈 것입니다.

어느 쪽이든 다른 언어를 사용하는 사람이 필요합니다.

nschulzke 에 2016년 07월 10일

@Lolinder 당신은 당신이 편한 언어를 고칠 수 있습니다. 문제를 닫을 수 있으며 번역 문제에서 업데이트가 처리됩니다.

raisedadead 에 2016년 07월 10일

Firefox에서 Google 크롬으로 전환하면 문제가 해결되었습니다. 정보가 다른 사람에게 도움이되기를 바랍니다.

mack318 에 2016년 07월 12일

👍1

잊혀진 것 같다, PR 제출하겠습니다 :)

ivantedja 에 2016년 09월 05일

이 페이지가 도움이 되었나요?

0 / 5 - 0 등급

Freecodecamp: Lobster 글꼴 모음에 대한 링크를 주석 처리하면 올바르게 렌더링되지 않습니다.

도전 이름

문제 설명

브라우저 정보

귀하의 코드

스크린 샷

가장 유용한 댓글

모든 15 댓글

관련 문제