«font-face» 태그된 질문

@ font-face는 웹 페이지에 포함 된 글꼴을 정의 할 수있는 CSS 규칙입니다.

18
비표준 글꼴을 웹 사이트에 추가하는 방법은 무엇입니까?
이미지, Flash 또는 다른 그래픽 을 사용하지 않고 웹 사이트에 사용자 정의 글꼴을 추가하는 방법이 있습니까? 예를 들어, 나는 결혼 웹 사이트에서 일하고 있었고 그 주제에 대한 멋진 글꼴을 많이 발견했습니다. 그러나 서버에 해당 글꼴을 추가하는 올바른 방법을 찾을 수 없습니다. CSS와 함께 해당 글꼴을 HTML에 어떻게 포함합니까? 그래픽 없이도 …
518 html  css  fonts  font-face 

7
같은 글꼴에 여러 글꼴 파일을 추가하는 방법은 무엇입니까?
@ font-face CSS rule 에 대한 MDC 페이지를 찾고 있지만 한 가지도 얻지 못했습니다. 굵게 , 기울임 꼴 및 굵게 + 기울임 꼴로 별도의 파일이 있습니다 . 세 가지 파일을 모두 하나의 @font-face규칙으로 포함하려면 어떻게해야합니까? 예를 들어 내가 가진 경우 : @font-face { font-family: "DejaVu Sans"; src: url("./fonts/DejaVuSans.ttf") format("ttf"); } …
454 fonts  css  font-face 

1
웹 브라우저에서 .otf 글꼴 사용
온라인에서 글꼴 평가판이 필요한 웹 사이트에서 작업하고 있습니다. 글꼴은 모두 .otf입니다. 글꼴을 포함시켜 모든 브라우저에서 작동하게하는 방법이 있습니까? 그렇지 않은 경우 다른 대안이 있습니까?
440 html  css  fonts  font-face 

14
@ font-face가 woff 파일에서 404 오류를 발생시키는 이유는 무엇입니까?
내가 사용하고 @font-face내 회사의 사이트에 그것은 큰 / 외모를 작동합니다. Firefox와 Chrome을 제외하고 .woff파일 에서 404 오류가 발생 합니다. IE는 오류를 발생시키지 않습니다. 루트에 글꼴이 있지만 CSS 폴더의 글꼴로 시도하고 글꼴의 전체 URL을 제공했습니다. 내 CSS 파일에서 해당 글꼴을 제거하면 404가 없으므로 구문 오류가 아닙니다. 또한 fontsquirrels 도구를 사용하여 @font-face글꼴과 …

12
Rails 자산 파이프 라인에서 글꼴 사용
Scss 파일에 다음과 같은 글꼴이 구성되어 있습니다. @font-face { font-family: 'Icomoon'; src: asset-url('icoMoon.eot?#iefix', font) format('embedded-opentype'), asset-url('icoMoon.woff', font) format('woff'), asset-url('icoMoon.ttf', font) format('truetype'), asset-url('icoMoon.svg#Icomoon', font) format('svg'); } 실제 글꼴 파일은 / app / assets / fonts /에 저장됩니다 config.assets.paths << Rails.root.join("app", "assets", "fonts")내 application.rb 파일에 추가 했습니다 컴파일 CSS 소스는 다음과 같습니다. …


18
이 '느린 네트워크가 감지되었습니다…'로그가 Chrome에 표시되는 이유는 무엇인가요?
이것이 info logChrome Dev (버전 55.0.2883.18 dev)에 나타나기 시작한 이유를 알 수 없습니다. 네트워크 속도가 느립니다. : 대체 글꼴을로드하는 동안 사용되는 HTTP : //font-path.extension를 ` font-face로컬 페이지 및 Chrome 확장 프로그램에서도을 사용하는 모든 웹 사이트에 표시됩니다 .

16
“X”에 대한 유니 코드 문자 취소 / 닫기?
CSS만을 사용하여 닫기 버튼을 만들고 싶습니다. 나는 이것이 처음이 아니라고 확신합니다. 누가 어떤 글꼴이 높이와 같은 너비의 'x'를 가지고 있는지 알고 있으므로 크로스 브라우저를 사용하여 닫기 버튼처럼 보일 수 있습니까?
219 css  fonts  font-face 

28
CSS @ font-face는 Firefox에서는 작동하지 않지만 Chrome 및 IE에서는 작동합니다.
다음 코드는 IE 7뿐만 아니라 Chrome 베타에서도 작동합니다. 그러나 Firefox에 문제가있는 것 같습니다. CSS 파일이 어떻게 포함되는지에 문제가 있다고 생각합니다. Firefox가 도메인 간 가져 오기에 너무 친숙하지 않다는 것을 알고 있습니다. 그러나 이것은 모두 정적 HTML 일 뿐이며 도메인 간 문제는 없습니다. 내 landing-page.html에서 CSS 가져 오기를 수행합니다. <link rel="stylesheet" …

8
CSS를 사용하여 사용자 정의 글꼴을 사용하십니까?
사이트에서 사용자 정의 글꼴을 사용하는 일부 새로운 웹 사이트 (일반 Arial, Tahoma 등 제외)를 보았습니다. 그리고 많은 브라우저를 지원합니다. 어떻게합니까? 또한 가능한 경우 사람들이 글꼴을 무료로 다운로드 할 수 없도록합니다.
175 css  font-face 

1
글꼴이 포함 된 SVG 이미지에 적합한 MIME 유형
이것은 일반적인 SVG MIME 유형입니다. image/svg+xml 그리고 그것은 잘 작동합니다. 그러나 SVG 글꼴을 포함시킬 때 크롬은 이미지 대신 글꼴을 반환하기 때문에 MIME 유형이 잘못되었음을 나타냅니다. 보편적 인 MIME 유형이 있습니까? 크롬이 잘못 되었나요? 되어 application/svg+xml어떻게 든 가능? 나는 이것이 여전히 HTML5에서 회색 영역이라고 생각하지만 여기 누군가가 알고있을 것입니다.

12
Amazon S3 CORS (Cross-Origin Resource Sharing) 및 Firefox 도메인 간 글꼴로드
Firefox가 현재 웹 페이지와 다른 출처에서 글꼴을로드하지 않는 문제가 오랫동안있었습니다. 일반적으로이 문제는 글꼴이 CDN에서 제공 될 때 발생합니다. 다른 질문에서 다양한 솔루션이 제기되었습니다. CSS @ font-face는 Firefox에서는 작동하지 않지만 Chrome 및 IE에서는 작동합니다. Amazon S3 CORS가 도입되면서 CORS를 사용하여 Firefox의 글꼴로드 문제를 해결하는 솔루션이 있습니까? 편집 : S3 CORS 구성의 …

3
CSS @ font-face-“src : local ( '☺')”은 무슨 뜻입니까?
@font-face처음 사용 하고 fontsquirrel에서 글꼴 키트를 다운로드했습니다. 그들이 내 CSS에 삽입하도록 권장하는 코드는 다음과 같습니다. @font-face { font-family: 'junctionregularRegular'; src: url('Junction-webfont.eot'); src: local('☺'), url('Junction-webfont.woff') format('woff'), url('Junction-webfont.ttf') format('truetype'), url('Junction-webfont.svg#webfontoNEpZXy2') format('svg'); } 이제, 웃는 얼굴이 엉망이되었습니다. 그러나 src의 URL 수도 마찬가지입니다. 왜 그렇게 많은 파일을 추천하고 페이지가 렌더링 될 때 모두 브라우저로 …
133 css  font-face 

18
IE9에서 Adobe 글꼴이 CSS3 @ font-face와 작동하도록 설정
작은 인트라넷 응용 프로그램을 작성하는 중입니다. 운 좋게도 최근에 구입 한 Adobe 글꼴 을 사용해보십시오 . 내가 알았 듯이 우리의 경우 라이센스 위반이 아닙니다. 모든 주요 브라우저를 대상으로 .ttf / .otf 버전의 글꼴을 .woff, .eot 및 .svg로 변환했습니다. 내가 사용한 @ font-face 구문은 기본적으로 Font Spring 의 방탄 구문입니다 . …

2
여러 글꼴 두께, 하나의 @ font-face 쿼리
Klavika 글꼴을 가져와야하는데 여러 모양과 크기로 받았습니다. Klavika-Bold-Italic.otf Klavika-Bold.otf Klavika-Light-Italic.otf Klavika-Light.otf Klavika-Medium-Italic.otf Klavika-Medium.otf Klavika-Regular-Italic.otf Klavika-Regular.otf 이제 하나의 @font-face-query 로 CSS로 가져올 수 있는지 알고 싶습니다 weight. 쿼리 복사 / 붙여 넣기를 8 번 피하고 싶습니다. 그래서 다음과 같습니다. @font-face { font-family: 'Klavika'; src: url(../fonts/Klavika-Regular.otf), weight:normal; src: url(../fonts/Klavika-Bold.otf), weight:bold; }
118 css  fonts  font-face 

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.