380:
which are by default always available. In the absence of a font being found, the web browser will use its default font, which may be a user-defined one. Depending on the web browser, a user can in fact override the font defined by the code writer. This may be for personal taste reasons, but may also
660:
not describing themselves as part of a family, partially motivated by the fact that few editors at the time supported the selection among more than four font styles (bold/regular and italics/regular).
330:, and derived systems specifies a list of prioritized fonts and generic family names; in conjunction with correlating font properties, this list determines the particular
145:
693:), but the result depends on the fonts installed on the user machine. The actual appearance will depend on the browser and the fonts installed on the system. A
369:(character shapes), differentiated from other fonts in the same family by additional properties such as stroke weight, slant, relative width, etc. The CSS term
271:
376:
In both HTML and CSS, the list is separated by commas. To avoid unexpected results, the last font family on the font list should be one of the
724:
Usually only a small subset of them, chiefly the Serif, Sans-serif, Monospace and
Cursive are easily configurable by user in web browsers.
671:. Neither CSS2 nor CSS3 endorse such a use (they are not found in examples), but most browsers accept them as valid "names" nevertheless.
381:
be because of some physical limitation of the user, such as the need for a larger font size or the avoidance of certain colors.
302:
743:
with Times New Roman. These families are not generic in the CSS sense, and are generally not handled at the browser level.
276:
233:
172:
140:
694:
228:
752:
130:
373:
is matched with "font"; it is decided by a combination of the font family and the additional properties.
162:
820:
848:
334:
used to render characters. The family selection is available in two forms: in the deprecated (X)HTML
167:
84:
652:
entry and its non-standard HTML predecessor has also historically been used to identify the entire
295:
640:
to put a space after the comma, and to put any name containing spaces between quotation marks.
757:
732:
702:
786:
405:
150:
710:
111:
52:
767:
680:
385:
377:
255:
118:
62:
843:
837:
637:
288:
157:
123:
106:
101:
96:
91:
42:
435:
250:
245:
135:
79:
762:
194:
189:
67:
57:
807:
657:
669:
font-family: 'Gill Sans', 'Heisei Mincho'; font-weight: 900
648:
Although CSS tries to define a font family as the same as a typeface, the
17:
355:
557:"font-family: times, serif; font-size:14pt; font-style:italic"
698:
665:
font-family: 'Gill Sans
Extrabold', 'Heisei Mincho W9'
240:
216:
718:
409:
359:, which is a grouping of fonts defined by shared design styles. A
320:
221:
211:
206:
199:
74:
47:
384:
In addition to local fonts, modern web browsers support linking
361:
323:
33:
663:
As a result, it used to be common to see declarations such as
424:
417:
327:
177:
450:
is not deprecated in general, but its presentational use is.)
392:
declaration. Once included, such fonts can be listed in the
534:
Sample text formatted with CSS in a separate stylesheet.
611:
Sample text formatted with the deprecated FONT tag.
668:
664:
649:
443:
428:
343:
339:
404:The following example defines the same font face (
396:property, alongside all local and fallback fonts.
735:alternatives. For example, Windows substitutes
731:to replace missing "well-known" families with
296:
8:
681:Web typography § Generic font families
303:
289:
29:
727:Many systems also perform special-cased
778:
562:Sample text formatted with inline CSS.
353:is matched with the typographical term
263:
32:
667:in place of the pedantically correct
412:, 14 points, italics) in three ways:
7:
689:can use a specific named font (like
447:
439:
335:
705:, for instance, will display both
25:
821:"Font Technology - Globalization"
806:very few web browsers, including
440:<font>...</font>
336:<font>...</font>
442:and its non-standard attribute
427:applied to an element via the
1:
277:Comparison of browser engines
865:
810:, support changing Cursive
678:
448:<i>...</i>
342:attribute, and in the CSS
420:in a separate stylesheet.
272:Document markup languages
644:Font name as family name
597:"times, serif"
514:
453:
656:. This usage is due to
438:presentational element
365:is a particular set of
753:Core fonts for the Web
388:directly by using the
763:Presentational markup
163:Document Object Model
695:default installation
168:Browser Object Model
27:CSS property in HTML
141:Character encodings
827:. 31 January 2022.
825:docs.microsoft.com
758:List of typefaces
733:metric-compatible
729:font substitution
703:Microsoft Windows
386:custom font files
338:element with its
313:
312:
16:(Redirected from
856:
829:
828:
817:
811:
804:
798:
797:
795:
794:
783:
739:with Arial, and
691:Heisei Mincho W9
670:
666:
651:
632:
629:
626:
623:
620:
617:
614:
610:
607:
604:
601:
598:
595:
592:
589:
586:
583:
580:
577:
574:
571:
568:
565:
561:
558:
555:
552:
549:
546:
543:
540:
537:
533:
530:
529:"text"
527:
524:
521:
518:
511:
508:
505:
502:
499:
496:
493:
490:
487:
484:
481:
478:
475:
472:
469:
466:
463:
460:
457:
449:
445:
441:
430:
395:
391:
378:generic families
345:
341:
337:
305:
298:
291:
256:Rendering engine
146:named characters
30:
21:
864:
863:
859:
858:
857:
855:
854:
853:
834:
833:
832:
819:
818:
814:
805:
801:
792:
790:
785:
784:
780:
776:
749:
711:Times New Roman
683:
677:
646:
634:
633:
630:
627:
624:
621:
618:
615:
612:
608:
605:
602:
599:
596:
593:
590:
587:
584:
581:
578:
575:
572:
569:
566:
563:
559:
556:
553:
550:
547:
544:
541:
538:
535:
531:
528:
525:
522:
519:
516:
513:
512:
509:
506:
503:
500:
497:
494:
491:
488:
485:
482:
479:
476:
473:
470:
467:
464:
461:
458:
455:
402:
393:
389:
309:
28:
23:
22:
15:
12:
11:
5:
862:
860:
852:
851:
846:
836:
835:
831:
830:
812:
799:
777:
775:
772:
771:
770:
768:Web typography
765:
760:
755:
748:
745:
679:Main article:
676:
673:
645:
642:
515:
454:
452:
451:
432:
421:
401:
398:
311:
310:
308:
307:
300:
293:
285:
282:
281:
280:
279:
274:
266:
265:
261:
260:
259:
258:
253:
248:
243:
238:
237:
236:
226:
225:
224:
219:
214:
204:
203:
202:
192:
187:
182:
181:
180:
170:
165:
160:
155:
154:
153:
148:
138:
133:
128:
127:
126:
119:HTML attribute
116:
115:
114:
109:
104:
99:
89:
88:
87:
85:Mobile Profile
82:
72:
71:
70:
65:
60:
55:
45:
37:
36:
26:
24:
14:
13:
10:
9:
6:
4:
3:
2:
861:
850:
847:
845:
842:
841:
839:
826:
822:
816:
813:
809:
803:
800:
788:
782:
779:
773:
769:
766:
764:
761:
759:
756:
754:
751:
750:
746:
744:
742:
738:
734:
730:
725:
722:
720:
716:
712:
708:
704:
700:
696:
692:
688:
682:
675:Generic fonts
674:
672:
661:
659:
655:
643:
641:
639:
638:best practice
606:"3"
437:
433:
426:
422:
419:
415:
414:
413:
411:
408:or a default
407:
399:
397:
387:
382:
379:
374:
372:
368:
364:
363:
358:
357:
352:
349:The CSS term
347:
333:
329:
325:
322:
319:selection in
318:
306:
301:
299:
294:
292:
287:
286:
284:
283:
278:
275:
273:
270:
269:
268:
267:
262:
257:
254:
252:
249:
247:
244:
242:
239:
235:
232:
231:
230:
227:
223:
220:
218:
215:
213:
210:
209:
208:
205:
201:
198:
197:
196:
193:
191:
188:
186:
183:
179:
176:
175:
174:
171:
169:
166:
164:
161:
159:
158:Language code
156:
152:
149:
147:
144:
143:
142:
139:
137:
134:
132:
129:
125:
124:alt attribute
122:
121:
120:
117:
113:
110:
108:
105:
103:
100:
98:
95:
94:
93:
90:
86:
83:
81:
78:
77:
76:
73:
69:
66:
64:
61:
59:
56:
54:
51:
50:
49:
46:
44:
41:
40:
39:
38:
35:
31:
19:
824:
815:
802:
791:. Retrieved
781:
740:
736:
728:
726:
723:
714:
706:
690:
686:
684:
662:
653:
647:
635:
423:With inline
403:
383:
375:
370:
366:
360:
354:
350:
348:
331:
316:
314:
184:
173:Style sheets
102:div and span
92:HTML element
43:Dynamic HTML
849:Typesetting
713:, and both
687:font-family
650:font-family
465:font-family
394:font-family
351:font family
344:font-family
317:font family
264:Comparisons
251:Web storage
246:Quirks mode
185:Font family
136:HTML editor
838:Categories
793:2013-09-21
715:sans-serif
658:font files
498:font-style
436:deprecated
431:attribute.
390:@font-face
346:property.
195:JavaScript
190:Web colors
131:HTML frame
18:Font faces
808:Konqueror
737:Helvetica
654:font face
625:></
619:></
483:font-size
434:With the
371:font face
332:font face
234:Validator
789:. W3.org
747:See also
636:It is a
585:><
579:><
400:Examples
356:typeface
787:"Fonts"
699:Firefox
151:Unicode
112:marquee
53:article
504:italic
367:glyphs
241:WHATWG
217:WebGPU
63:canvas
774:Notes
741:Times
719:Arial
707:serif
613:</
564:</
551:style
536:</
523:class
477:serif
471:times
429:style
416:With
410:serif
406:Times
222:WebXR
212:WebGL
207:Web3D
200:WebCL
107:blink
80:Basic
75:XHTML
68:video
58:audio
48:HTML5
844:HTML
685:The
631:>
616:font
609:>
600:size
591:face
588:font
573:<
570:>
560:>
545:<
542:>
532:>
517:<
459:text
444:face
362:font
340:face
324:HTML
315:The
97:meta
34:HTML
717:as
709:as
701:on
697:of
446:. (
425:CSS
418:CSS
328:CSS
321:(X)
229:W3C
178:CSS
840::
823:.
721:.
492:pt
489:14
326:,
796:.
628:p
622:i
603:=
594:=
582:i
576:p
567:p
554:=
548:p
539:p
526:=
520:p
510:}
507:;
501::
495:;
486::
480:;
474:,
468::
462:{
456:.
304:e
297:t
290:v
20:)
Text is available under the Creative Commons Attribution-ShareAlike License. Additional terms may apply.