Implementing @font-face

•Als PPT, PDF herunterladen•

0 gefällt mir•1,221 views

The document discusses the @font-face CSS rule which allows using fonts that are not installed on a user's computer on web pages. It provides the history of @font-face, how it is supported by different browsers, and how to implement it by including a @font-face rule in the style sheet and referencing font files. Additional tips are given such as using fall-back fonts and ensuring fonts have a web-font license.

Technologie Design

@font-face is a CSS rule which allows you to show a font on a Web page even if that font is not installed on the users' computer.

[object Object],[object Object],[object Object],[object Object],[object Object]

[object Object],[object Object],[object Object]

[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

[object Object],[object Object],[object Object],[object Object],@font-face { font-family: <a-remote-font-name>; src: <source>; }

[object Object],[object Object],@font-face { font-family: MyriadPro; src: url('/MyriadPro.eot'); src: local(Myriad Pro'), url('/MyriadPro') format('opentype'), url(‘/MyriadPro') format('svg') } h1 { font-family: MyriadPro, Arial, Verdana, Serif; } Note: The above example uses some fall-back options in case @font-face isn't supported.

[object Object],[object Object],[object Object],[object Object]

Weitere ähnliche Inhalte

Was ist angesagt?

HTML Lesson 1

Danny Ambrosio

Html basic

Nital Shingala

Iml 140 web_week_2_html_basics_

Evan Hughes

20120424 c

slidesharepimp

Static web sites assignment 1 philip lemmon1

Lemmon12

Html For Bloggers

Webgrrls International

Html5 structure tags

SEO SKills

HTML & CSS 2017

Colin Loretz

Css Founder.com | Cssfounder Org

Css Founder

Html cheat sheet

Lam Hoang

Was ist angesagt? (10)

HTML Lesson 1

Html basic

Iml 140 web_week_2_html_basics_

20120424 c

Static web sites assignment 1 philip lemmon1

Html For Bloggers

Html5 structure tags

HTML & CSS 2017

Css Founder.com | Cssfounder Org

Html cheat sheet

Andere mochten auch

Presentacion

Ivan Ivan

Aavara Brochure 2011 Ise

AAVARA

Globalijhbuihuhzacin Impacto

Adolfo Antonio Loncomil Huencho

Medu 635 Rome Images

aalawler

Lead Nurturing and Marketing Automation

Act-On Software

Hype vs. Reality: The AI Explainer

Luminary Labs

Andere mochten auch (6)

Presentacion

Aavara Brochure 2011 Ise

Globalijhbuihuhzacin Impacto

Medu 635 Rome Images

Lead Nurturing and Marketing Automation

Hype vs. Reality: The AI Explainer

Ähnlich wie Implementing @font-face

User Defined Characters Solution Proposal

Jun Fujisawa

CSS @font-face : Personalized fonts

Yves Van Goethem

Web Fonts: Why Bother?

Greg Veen

What the @font-face

Gene Crawford

How do speed up web pages? CSS & HTML Tricks

Compare Infobase Limited

The Trouble With Type

elliotjaystocks

Web font services: March 2011

RZasadzinski

Web Typography with sIFR 3 at Drupalcamp Copenhagen

Mark Wubben

Use Web Skills To Build Mobile Apps

Nathan Smith

Progressive Enhancement & Intentional Degradation 2

elliotjaystocks

Progressive enhancement

Zohar Arad

new fonts for the web

Marc Tobias Kunisch

Making drupal beautiful with web fonts

Four Kitchens

User Defined Characters and SVG Fonts

Jun Fujisawa

Progressive enhancement - Bridging the gap between CSS2 and CSS3

Zohar Arad

Drupal Camp LA 2011: Typography modules for Drupal

Ashok Modi

Workshop 6: Designer tools

Visual Engineering

Css3 101

Ignacio Coloma

Web Scraper Shibuya.pm tech talk #8

Tatsuhiko Miyagawa

Web 2.0 Lessonplan Day1

Jesse Thomas

Ähnlich wie Implementing @font-face (20)

User Defined Characters Solution Proposal

CSS @font-face : Personalized fonts

Web Fonts: Why Bother?

What the @font-face

How do speed up web pages? CSS & HTML Tricks

The Trouble With Type

Web font services: March 2011

Web Typography with sIFR 3 at Drupalcamp Copenhagen

Use Web Skills To Build Mobile Apps

Progressive Enhancement & Intentional Degradation 2

Progressive enhancement

new fonts for the web

Making drupal beautiful with web fonts

User Defined Characters and SVG Fonts

Progressive enhancement - Bridging the gap between CSS2 and CSS3

Drupal Camp LA 2011: Typography modules for Drupal

Workshop 6: Designer tools

Css3 101

Web Scraper Shibuya.pm tech talk #8

Web 2.0 Lessonplan Day1

Kürzlich hochgeladen

Axa Assurance Maroc - Insurer Innovation Award 2024

The Digital Insurer

What is a good lead in your organisation? Which leads are priority? What happens to leads? When sales and marketing give different answers to these questions, or perhaps aren't sure of the answers at all, frustrations build and opportunities are left on the table. Join us for an illuminating session with Cian McLoughlin, HubSpot Principal Customer Success Manager, as we look at that crucial piece of the customer journey in which leads are transferred from marketing to sales.

04-2024-HHUG-Sales-and-Marketing-Alignment.pptx

HampshireHUG

Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024

The Digital Insurer

Tech Trends Report 2024 Future Today Institute.pdf

hans926745

Evaluating the top large language models.pdf

ChristopherTHyatt

In this session, we will delve into strategic approaches for optimizing knowledge management within Microsoft 365, amidst the evolving landscape of Copilot. From leveraging automatic metadata classification and permission governance with SharePoint Premium, to unlocking Viva Engage for the cultivation of knowledge and communities, you will gain actionable insights to bolster your organization's knowledge-sharing initiatives. In this session, we will also explore how to facilitate solutions to enable your employees to find answers and expertise within Microsoft 365. You will leave equipped with practical techniques and a deeper understanding of how there is more to effective knowledge management than just enabling Copilot, but building actual solutions to prepare the knowledge that Copilot and your employees can use.

Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...

Drew Madelung

BooK Now Call us at +918448380779 to hire a gorgeous and seductive call girl for sex. Take a Delhi Escort Service. The help of our escort agency is mostly meant for men who want sexual Indian Escorts In Delhi NCR. It should be noted that any impersonator will get 100 attention from our Young Girls Escorts in Delhi. They will assume the position of reliable allies. VIP Call Girl With Original Photos Book Tonight +918448380779 Our Cheap Price 1 Hour not available 2 Hours 5000 Full Night 8000 TAG: Call Girls in Delhi, Noida, Gurgaon, Ghaziabad, Connaught Place, Greater Kailash Delhi, Lajpat Nagar Delhi, Mayur Vihar Delhi, Chanakyapuri Delhi, New Friends Colony Delhi, Majnu Ka Tilla, Karol Bagh, Malviya Nagar, Saket, Khan Market, Noida Sector 18, Noida Sector 76, Noida Sector 51, Gurgaon Mg Road, Iffco Chowk Gurgaon, Rajiv Chowk Gurgaon All Delhi Ncr Free Home Deliver

08448380779 Call Girls In Friends Colony Women Seeking Men

Delhi Call girls

GenCyber Cyber Security Day Presentation

Michael W. Hawkins

Finology Group – Insurtech Innovation Award 2024

The Digital Insurer

presentation ICT roal in 21st century education

jfdjdjcjdnsjd

Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...

Neo4j

Strategies for Landing an Oracle DBA Job as a Fresher

Remote DBA Services

How to convert PDF to text with Nanonets

naman860154

Partners Life - Insurer Innovation Award 2024

The Digital Insurer

08448380779 Call Girls In Greater Kailash - I Women Seeking Men

Delhi Call girls

The Raspberry Pi 5 was announced on October 2023. This new version of the popular embedded device comes with a new iteration of Broadcom’s VideoCore GPU platform, and was released with a fully open source driver stack, developed by Igalia. The presentation will discuss some of the major changes required to support this new Video Core iteration, the challenges we faced in the process and the solutions we provided in order to deliver conformant OpenGL ES and Vulkan drivers. The talk will also cover the next steps for the open source Raspberry Pi 5 graphics stack. (c) Embedded Open Source Summit 2024 April 16-18, 2024 Seattle, Washington (US) https://events.linuxfoundation.org/embedded-open-source-summit/ https://eoss24.sched.com/event/1aBEx

Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...

Igalia

A Domino Admins Adventures (Engage 2024)

Gabriella Davis

Imagine a world where information flows as swiftly as thought itself, making decision-making as fluid as the data driving it. Every moment is critical, and the right tools can significantly boost your organization’s performance. The power of real-time data automation through FME can turn this vision into reality. Aimed at professionals eager to leverage real-time data for enhanced decision-making and efficiency, this webinar will cover the essentials of real-time data and its significance. We’ll explore: FME’s role in real-time event processing, from data intake and analysis to transformation and reporting An overview of leveraging streams vs. automations FME’s impact across various industries highlighted by real-life case studies Live demonstrations on setting up FME workflows for real-time data Practical advice on getting started, best practices, and tips for effective implementation Join us to enhance your skills in real-time data automation with FME, and take your operational capabilities to the next level.

From Event to Action: Accelerate Your Decision Making with Real-Time Automation

Safe Software

Discord is a free app offering voice, video, and text chat functionalities, primarily catering to the gaming community. It serves as a hub for users to create and join servers tailored to their interests. Discord’s ecosystem comprises servers, each functioning as a distinct online community with its own channels dedicated to specific topics or activities. Users can engage in text-based discussions, voice calls, or video chats within these channels. Understanding Discord Servers Discord servers are virtual spaces where users congregate to interact, share content, and build communities. Servers may revolve around gaming, hobbies, interests, or fandoms, providing a platform for like-minded individuals to connect. Communication Features Discord offers a range of communication tools, including text channels for messaging, voice channels for real-time audio conversations, and video channels for face-to-face interactions. These features facilitate seamless communication and collaboration. What Does NSFW Mean? The acronym NSFW stands for “Not Safe For Work,” indicating content that may be inappropriate for professional or public settings. NSFW Content NSFW content encompasses material that is sexually explicit, violent, or otherwise graphic in nature. It often includes nudity, profanity, or depictions of sensitive topics.

Understanding Discord NSFW Servers A Guide for Responsible Users.pdf

UK Journal

2024: Domino Containers - The Next Step. News from the Domino Container commu...

Martijn de Jong

Kürzlich hochgeladen (20)

Axa Assurance Maroc - Insurer Innovation Award 2024

04-2024-HHUG-Sales-and-Marketing-Alignment.pptx

Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024

Tech Trends Report 2024 Future Today Institute.pdf

Evaluating the top large language models.pdf

Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...

08448380779 Call Girls In Friends Colony Women Seeking Men

GenCyber Cyber Security Day Presentation

Finology Group – Insurtech Innovation Award 2024

presentation ICT roal in 21st century education

Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...

Strategies for Landing an Oracle DBA Job as a Fresher

How to convert PDF to text with Nanonets

Partners Life - Insurer Innovation Award 2024

08448380779 Call Girls In Greater Kailash - I Women Seeking Men

Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...

A Domino Admins Adventures (Engage 2024)

From Event to Action: Accelerate Your Decision Making with Real-Time Automation

Understanding Discord NSFW Servers A Guide for Responsible Users.pdf

2024: Domino Containers - The Next Step. News from the Domino Container commu...