-
Notifications
You must be signed in to change notification settings - Fork 501
/
CSSRef.ejs
1491 lines (1451 loc) · 83.6 KB
/
CSSRef.ejs
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
<%
const text = mdn.localStringMap({
'en-US': {
'Tutorials': 'Tutorials',
'CSS_basics': 'CSS basics',
'CSS_first_steps': 'CSS first steps',
'CSS_first_steps_overview': 'CSS first steps overview',
'What_is_CSS': 'What is CSS?',
'Getting_started_with_CSS': 'Getting started with CSS',
'How_CSS_is_structured': 'How CSS is structured',
'How_CSS_works': 'How CSS works',
'Assessment_Styling_a_biography_page': 'Assessment: Styling a biography page',
'CSS_building_blocks': 'CSS building blocks',
'CSS_building_blocks_overview': 'CSS building blocks overview',
'CSS_selectors': 'CSS selectors',
'Type_Class_and_ID_Selectors': 'Type, class, and ID selectors',
'Attribute_selectors': 'Attribute selectors',
'Pseudo-classes_and_pseudo-elements': 'Pseudo-classes and pseudo-elements',
'Combinators': 'Combinators',
'Cascade_and_inheritance': 'Cascade, specificity, and inheritance',
'Cascade_layers': 'Cascade layers',
'The_box_model': 'The box model',
'Backgrounds_and_borders': 'Backgrounds and borders',
'Handling_different_text_directions': 'Handling different text directions',
'Overflowing_content': 'Overflowing content',
'CSS_values_and_units': 'CSS values and units',
'Sizing_items_in_CSS': 'Sizing items in CSS',
'Images_media_and_form_elements': 'Images, media, and form elements',
'Styling_tables': 'Styling tables',
'Debugging_CSS': 'Debugging CSS',
'Organizing_your_CSS': 'Organizing your CSS',
'Assessment_Fundamental_CSS_comprehension': 'Assessment: Fundamental CSS comprehension',
'Assessment_Creating_fancy_letterheaded_paper': 'Assessment: Creating fancy letterheaded paper',
'Assessment_A_cool_looking_box': 'Assessment: A cool-looking box',
'Styling_text': 'Styling text',
'Styling_text_overview': 'Styling text overview',
'Fundamental_text_and_font_styling': 'Fundamental text and font styling',
'Styling_lists': 'Styling lists',
'Styling_links': 'Styling links',
'Web_fonts': 'Web fonts',
'Assessment_Typesetting_a_community_school_homepage': 'Assessment: Typesetting a community school homepage',
'CSS_layout': 'CSS layout',
'CSS_layout_overview': 'CSS layout overview',
'Introduction_to_CSS_layout' : 'Introduction to CSS layout',
'Normal_Flow' : 'Normal Flow',
'Flexbox': 'Flexbox',
'Grids' : 'Grids',
'Floats': 'Floats',
'Positioning': 'Positioning',
'Multiple-column_layout': 'Multiple-column layout',
'Responsive_design': 'Responsive design',
'Beginners_guide_to_media_queries': 'Beginner\'s guide to media queries',
'Legacy_layout_methods': 'Legacy layout methods',
'Supporting_older_browsers': 'Supporting older browsers',
'Assessment_Fundamental_Layout_Comprehension' : 'Assessment: Fundamental layout comprehension',
'Reference': 'Reference',
'Guides': 'Guides',
'Animations': 'Animations',
'Using_CSS_animations': 'Using CSS animations',
'Backgrounds_and_Borders': 'Backgrounds and Borders',
'Using_multiple_backgrounds': 'Using multiple backgrounds',
'Resizing_background_images': 'Resizing background images',
'Box_alignment': 'Box alignment',
'Box_alignment_in_block_layout': 'Box alignment in block layout',
'Box_alignment_in_flexbox': 'Box alignment in flexbox',
'Box_alignment_in_grid_layout': 'Box alignment in grid layout',
'Box_alignment_in_multi-column_layout': 'Box alignment in multi-column layout',
'Box_model': 'Box model',
'Introduction_to_the_CSS_basic_box_model': 'Introduction to the CSS basic box model',
'Mastering_margin_collapsing': 'Mastering margin collapsing',
'Colors': 'Colors',
'Applying_color_to_HTML_elements_using_CSS': 'Applying color to HTML elements',
'Web_Accessibility_Understanding_Colors_and_Luminance': 'Accessibility: Understanding colors and luminance',
'Color_contrast': 'Accessibility: Color contrast',
'Columns': 'Columns',
'Basic_concepts_of_Multicol': 'Basic concepts of Multicol',
'Styling_columns': 'Styling columns',
'Spanning_and_balancing': 'Spanning and balancing',
'Handling_overflow_in_Multicol': 'Handling overflow in Multicol',
'Content_breaks_in_Multicol': 'Content breaks in Multicol',
'Conditional_rules': 'Conditional rules',
'Using_feature_queries': 'Using feature queries',
'Containment' : 'Containment',
'Using_CSS_containment' : 'Using CSS containment',
'Container_queries' : 'CSS container queries',
'Container_size_and_style_queries' : 'Using container size and style queries',
'CSSOM_view': 'CSSOM view',
'Coordinate_systems': 'Coordinate systems',
'Flexbox': 'Flexbox',
'Basic_concepts_of_Flexbox': 'Basic concepts of Flexbox',
'Comparison_with_other_layout_methods': 'Comparison with other layout methods',
'Aligning_items_in_a_flex_container': 'Aligning items in a flex container',
'Ordering_flex_items': 'Ordering flex items',
'Controlling_flex_item_ratios': 'Controlling flex item ratios',
'Mastering_wrapping_of_flex_items': 'Mastering wrapping of flex items',
'Typical_use_cases_of_Flexbox': 'Typical use cases of Flexbox',
'Flow_layout': 'Flow layout',
'Block_and_Inline_layout_in_normal_flow': 'Block and Inline layout in normal flow',
'In_flow_and_Out_of_flow': 'In flow and Out of flow',
'Formatting_contexts_explained': 'Formatting contexts explained',
'Flow_layout_and_writing_modes': 'Flow layout and writing modes',
'Flow_layout_and_overflow': 'Flow layout and overflow',
'Fonts': 'Fonts',
'OpenType_font_features_guide': 'OpenType font features guide',
'Variable_fonts_guide': 'Variable fonts guide',
'Grid': 'Grid',
'Basics_concepts_of_grid_layout': 'Basics concepts of grid layout',
'Relationship_to_other_layout_methods': 'Relationship to other layout methods',
'Line-based_placement': 'Line-based placement',
'Grid_template_areas': 'Grid template areas',
'Layout_using_named_grid_lines': 'Layout using named grid lines',
'Auto-placement_in_grid_layout': 'Auto-placement in grid layout',
'Box_alignment_in_grid_layout': 'Box alignment in grid layout',
'Grids_logical_values_and_writing_modes': 'Grids, logical values and writing modes',
'Grid_layout_and_accessibility': 'Grid layout and accessibility',
'Grid_Layout_and_progressive_enhancement': 'Grid Layout and progressive enhancement',
'Realizing_common_layouts_using_grids': 'Realizing common layouts using grids',
'Subgrid': 'Subgrid',
'Masonry_layout': 'Masonry layout',
'Images': 'Images',
'Using_CSS_gradients': 'Using CSS gradients',
'Lists_and_counters': 'Lists and counters',
'Using_CSS_counters': 'Using CSS counters',
'Consistent_list_indentation': 'Consistent list indentation',
'Logical_properties': 'Logical properties',
'Basic_concepts': 'Basic concepts',
'Floating_and_positioning': 'Floating and positioning',
'Margins_borders_and_padding': 'Margins, borders and padding',
'Sizing': 'Sizing',
'Math_functions': 'Math functions',
'Using_CSS_math_functions': 'Using CSS math functions',
'Media_queries': 'Media queries',
'Using_media_queries': 'Using media queries',
'Using_media_queries_for_accessibility': 'Using media queries for accessibility',
'Testing_media_queries_programmatically': 'Testing media queries programmatically',
'Printing': 'Printing',
'Nesting': 'Nesting style rules',
'Using_CSS_nesting': 'Using CSS nesting',
'Nesting_and_specificity': 'Nesting and specificity',
'Nesting_at-rules': 'Nesting at-rules',
'Positioning': 'Positioning',
'Understanding_CSS_z-index': 'Understanding CSS z-index',
'Scroll_snap': 'Scroll snap',
'Basic_concepts_of_scroll_snap': 'Basic concepts of scroll snap',
'Shapes': 'Shapes',
'Overview_of_shapes': 'Overview of shapes',
'Shapes_from_box_values': 'Shapes from box values',
'Basic_shapes': 'Basic shapes',
'Shapes_from_images': 'Shapes from images',
'Text': 'Text',
'Wrapping_and_breaking_text': 'Wrapping and breaking text',
'Transforms': 'Transforms',
'Using_transforms': 'Using transforms',
'Transitions': 'Transitions',
'Using_transitions': 'Using transitions',
'Layout_cookbook': 'Layout cookbook',
'Media_objects': 'Media objects',
'Columns': 'Columns',
'Center_an_element': 'Center an element',
'Sticky_footers': 'Sticky footers',
'Split_navigation': 'Split navigation',
'Breadcrumb_navigation': 'Breadcrumb navigation',
'List_group_with_badges': 'List group with badges',
'Pagination': 'Pagination',
'Card': 'Card',
'Grid_wrapper': 'Grid wrapper',
'Tools': 'Tools',
'Color_picker_tool': 'Color picker',
'Box-shadow_generator': 'Box shadow generator',
'Border-radius_generator': 'Border radius generator',
'Border-image_generator' : 'Border image generator',
},
'fr': {
'Learn_CSS': 'Apprendre CSS',
'CSS_first_steps': 'Premiers pas en CSS',
'CSS_first_steps_overview': 'Aperçu des premiers pas en CSS',
'What_is_CSS': 'Qu\'est-ce que CSS\xa0?',
'Getting_started_with_CSS': 'Démarrer avec CSS',
'How_CSS_is_structured': 'Comment CSS est structuré',
'How_CSS_works': 'Comment CSS fonctionne',
'Using_your_new_knowledge': 'Utiliser ces nouvelles notions',
'CSS_building_blocks': 'Les briques composant CSS',
'CSS_building_blocks_overview': 'Aperçu des briques composant CSS',
'Cascade_and_inheritance': 'Cascade et héritage',
'CSS_selectors': 'Sélecteurs CSS',
'The_box_model': 'Le modèle de boîte',
'Backgrounds_and_borders': 'Arrière-plans et bordures',
'Handling_different_text_directions': 'Gérer les différentes directions du texte',
'Overflowing_content': 'Dépassement du contenu',
'Values_and_units': 'Valeurs et unités',
'Sizing_items_in_CSS': 'Dimensionner des objets en CSS',
'Images_media_and_form_elements': 'Images, média, et éléments de formulaire',
'Styling_tables': 'Mettre en forme les tableaux',
'Debugging_CSS': 'Déboguer du CSS',
'Organizing_your_CSS': 'Organiser votre CSS',
'Styling_text': 'Mettre en forme du texte',
'Styling_text_overview': 'Aperçu de la mise en forme du texte',
'Fundamental_text_and_font_styling': 'Notions fondamentales pour la mise en forme du texte et des polices',
'Styling_lists': 'Mettre en forme les listes',
'Styling_links': 'Mettre en forme les liens',
'Web_fonts': 'Polices web',
'Assessment_typesetting_a_community_school_homepage': 'Évaluation\xa0: composer la page d\'accueil d\'une école',
'CSS_layout': 'Dispositions CSS',
'CSS_layout_overview': 'Aperçu des dispositions CSS',
'Layout_introduction' : 'Introduction aux dispositions CSS',
'Normal_Flow' : 'Flux normal',
'Flexbox': 'Boîtes flexibles',
'Grids' : 'Grilles',
'Floats': 'Flottements',
'Positioning': 'Positionnement',
'Multiple-column_Layout': 'Disposition en colonnes',
'Responsive_design': 'Conception adaptative',
'Media_queries': 'Guide d\'initiation aux requêtes média',
'Legacy_Layout_Methods': 'Méthodes de disposition historiques',
'Supporting_Older_Browsers': 'Prendre en charge les anciens navigateurs',
'Fundamental_Layout_Comprehension' : 'Compréhension des fondamentaux sur la disposition',
'Reference': 'Référence',
'Guides': 'Guides',
'Animations': 'Animations',
'Using_CSS_animations': 'Utiliser les animations CSS',
'Backgrounds_and_Borders': 'Arrière-plans et bordures',
'Using_multiple_backgrounds': 'Utiliser plusieurs arrière-plans',
'Resizing_background_images': 'Redimensionner les images d\'arrière-plan',
'Box_alignment': 'Alignement des boîtes',
'Box_alignment_in_block_layout': 'Alignement des boîtes avec la disposition en bloc',
'Box_alignment_in_flexbox': 'Alignement des boîtes avec les boîtes flexibles',
'Box_alignment_in_grid_layout': 'Alignement des boîtes avec les grilles',
'Box_alignment_in_multi-column_layout': 'Alignement des boîtes avec la disposition en colonnes',
'Box_model': 'Modèle de boîte',
'Introduction_to_the_CSS_basic_box_model': 'Introduction aux bases du modèle de boîte CSS',
'Mastering_margin_collapsing': 'Maîtriser la fusion des marges',
'Columns': 'Colonnes',
'Basic_concepts_of_Multicol': 'Concepts de base de la disposition en colonnes',
'Styling_columns': 'Mettre en forme les colonnes',
'Spanning_and_balancing': 'Étendre et équilibrer',
'Handling_overflow_in_Multicol': 'Gérer le dépassement avec les colonnes',
'Content_breaks_in_Multicol': 'Ruptures du contenu avec les colonnes',
'Conditional_rules': 'Règles conditionnelles',
'Using_feature_queries': 'Utiliser les requêtes de fonctionnalité',
'CSSOM_view': 'Vue CSSOM',
'Coordinate_systems': 'Systèmes de coordonnées',
'Flexbox': 'Boîtes flexibles',
'Basic_concepts_of_Flexbox': 'Concepts de base pour les boîtes flexibles',
'Comparison_with_other_layout_methods': 'Comparaison avec les autres méthodes de disposition',
'Aligning_items_in_a_flex_container': 'Aligner des objets dans un conteneur flexible',
'Ordering_flex_items': 'Ordonner des objets flexibles',
'Controlling_flex_item_ratios': 'Contrôler les proportions des objets flexibles',
'Mastering_wrapping_of_flex_items': 'Maîtriser le retour à la ligne des objets flexibles',
'Typical_use_cases_of_Flexbox': 'Cas d\'usage caractéristiques des boîtes flexibles',
'Flow_layout': 'Disposition de flux',
'Block_and_Inline_layout_in_normal_flow': 'Disposition de bloc et en ligne avec le flux normal',
'In_flow_and_Out_of_flow': 'Dans le flux et en dehors',
'Formatting_contexts_explained': 'Explication des contextes de formatage',
'Flow_layout_and_writing_modes': 'Disposition de flux et modes d\'écriture',
'Flow_layout_and_overflow': 'Disposition de flux et dépassement',
'Fonts': 'Polices',
'OpenType_font_features_guide': 'Guide des fonctionnalités des polices OpenType',
'Variable_fonts_guide': 'Guide des polices variables',
'Grid': 'Grille',
'Basics_concepts_of_grid_layout': 'Concepts de base de la disposition en grille',
'Relationship_to_other_layout_methods': 'Relations avec les autres méthodes de disposition',
'Line-based_placement': 'Placement basé sur les lignes',
'Grid_template_areas': 'Gabarits de zones de grille',
'Layout_using_named_grid_lines': 'Disposition en utilisant les lignes de grille nommées',
'Auto-placement_in_grid_layout': 'Placement automatique dans une disposition en grille',
'Box_alignment_in_grid_layout': 'Alignement des boîtes dans une disposition en grille',
'Grids_logical_values_and_writing_modes': 'Grilles, valeurs logiques et modes d\'écriture',
'Grid_layout_and_accessibility': 'Disposition en grille et accessibilité',
'Grid_Layout_and_progressive_enhancement': 'Disposition en grille et amélioration progressive',
'Realizing_common_layouts_using_grids': 'Réaliser des dispositions usuelles avec les grilles',
'Subgrid': 'Sous-grilles',
'Masonry_layout': 'Disposition en briques',
'Images': 'Images',
'Using_CSS_gradients': 'Utiliser les dégradés CSS',
'Lists_and_counters': 'Listes et compteurs',
'Using_CSS_counters': 'Utiliser les compteurs CSS',
'Consistent_list_indentation': 'Indentation cohérente des listes',
'Logical_properties': 'Propriétés logiques',
'Basic_concepts': 'Concepts de base',
'Floating_and_positioning': 'Flottement et positionnement',
'Margins_borders_and_padding': 'Marges, bordures et remplissage',
'Sizing': 'Dimensionnement',
'Media_queries': 'Requêtes média',
'Using_media_queries': 'Utiliser les requêtes média',
'Using_media_queries_for_accessibility': 'Utiliser les requêtes média pour l\'accessibilité',
'Testing_media_queries_programmatically': 'Tester les requêtes média de façon programmatique',
'Positioning': 'Positionnement',
'Understanding_CSS_z-index': 'Comprendre le z-index CSS',
'Scroll_snap': 'Ancrage du défilement',
'Basic_concepts_of_scroll_snap': 'Concepts de base pour l\'ancrage du défilement',
'Shapes': 'Formes',
'Overview_of_shapes': 'Aperçu des formes',
'Shapes_from_box_values': 'Formes à partir des valeurs de boîtes',
'Basic_shapes': 'Formes basiques',
'Shapes_from_images': 'Formes à partir d\'images',
'Text': 'Texte',
'Wrapping_and_breaking_text': 'Retour à la ligne et rupture du texte',
'Transforms': 'Transformations',
'Using_transforms': 'Utiliser les transformations',
'Transitions': 'Transitions',
'Using_transitions': 'Utiliser les transitions',
'Layout_cookbook': 'Livre de recettes pour la disposition',
'Media_objects': 'Objets média',
'Columns': 'Colonnes',
'Center_an_element': 'Centrer un élément',
'Sticky_footers': 'Pieds de page ancrés',
'Split_navigation': 'Navigation séparée',
'Breadcrumb_navigation': 'Navigation avec un fil d\'Ariane',
'List_group_with_badges': 'Listes de groupe avec des badges',
'Pagination': 'Pagination',
'Card': 'Carte',
'Grid_wrapper': 'Conteneur de grille',
'Tools': 'Outils',
'Color_picker_tool': 'Sélecteur de couleurs',
'Border-radius_generator': 'Générateur de border-radius',
'Box-shadow_generator': 'Générateur d\'ombre de boîte',
'Border-image_generator' : 'Générateur d\'image de bordure',
},
'ja': {
'Tutorials': 'チュートリアル',
'CSS_basics': 'CSS の基本',
'CSS_first_steps': 'CSS の第一歩',
'CSS_first_steps_overview': 'CSS の第一歩の概要',
'What_is_CSS': 'CSS とは何か',
'Getting_started_with_CSS': 'CSS 入門',
'How_CSS_is_structured': 'CSS の全体像',
'How_CSS_works': 'CSS の働き',
'Assessment_Styling_a_biography_page': '評価課題: 経歴ページのスタイル設定',
'CSS_building_blocks': 'CSS の構成要素',
'CSS_building_blocks_overview': 'CSS の構成要素の概要',
'Cascade_and_inheritance': 'カスケードと継承',
'CSS_selectors': 'CSS セレクター',
'The_box_model': 'ボックスモデル',
'Backgrounds_and_borders': '背景と境界',
'Handling_different_text_directions': '書字方向の操作',
'Overflowing_content': '内容のはみ出し',
'CSS_values_and_units': 'CSS の値と単位',
'Sizing_items_in_CSS': 'CSS における大きさの指定',
'Images_media_and_form_elements': '画像、メディア、フォームの要素',
'Styling_tables': '表のスタイル付け',
'Debugging_CSS': 'CSS のデバッグ',
'Organizing_your_CSS': 'CSS の整理',
'Assessment_Fundamental_CSS_comprehension': '評価課題: CSS の基本的な理解度',
'Assessment_Creating_fancy_letterheaded_paper': '評価課題: 素敵なレターヘッドの便箋の作成',
'Assessment_A_cool_looking_box': '評価課題: かっこいいボックス',
'Styling_text': 'テキストの装飾',
'Styling_text_overview': 'テキストの装飾の概要',
'Fundamental_text_and_font_styling': '基本的なテキストとフォントの装飾',
'Styling_lists': 'リストの装飾',
'Styling_links': 'リンクの装飾',
'Web_fonts': 'ウェブフォント',
'Assessment_Typesetting_a_community_school_homepage': '評価課題: コミュニティスクールのホームページの組版',
'CSS_layout': 'CSS レイアウト',
'CSS_layout_overview': 'CSS レイアウトの概要',
'Introduction_to_CSS_layout' : 'CSS レイアウト入門',
'Normal_Flow' : '通常フロー',
'Flexbox': 'フレックスボックス',
'Grids' : 'グリッド',
'Floats': '浮動',
'Positioning': '位置指定',
'Multiple-column_layout': '段組みレイアウト',
'Responsive_design': 'レスポンシブデザイン',
'Beginners_guide_to_media_queries': 'メディアクエリーの初心者向けガイド',
'Legacy_layout_methods': '古いレイアウト方法',
'Supporting_older_browsers': '古いブラウザーの対応',
'Assessment_Fundamental_Layout_Comprehension': '評価課題: 基礎的なレイアウトの理解',
},
'ko': {
'Tutorials': '자습서',
'CSS_basics': 'CSS 기초',
'CSS_first_steps': 'CSS 첫 번째 단계',
'CSS_first_steps_overview': 'CSS 첫 번째 단계',
'What_is_CSS': 'CSS란 무엇인가?',
'Getting_started_with_CSS': 'CSS 시작하기',
'How_CSS_is_structured': 'CSS의 구조',
'How_CSS_works': 'CSS 작동 방식',
'Assessment_Styling_a_biography_page': '과제: 프로필 페이지 만들기',
'CSS_building_blocks': 'CSS 구성요소',
'CSS_building_blocks_overview': 'CSS 구성요소',
'Cascade_and_inheritance': '계단식 및 상속',
'CSS_selectors': 'CSS 선택자',
'The_box_model': '박스 모델',
'Backgrounds_and_borders': '배경 및 테두리',
'Handling_different_text_directions': '텍스트 표시 방향 제어하기',
'Overflowing_content': '콘텐츠 overflow',
'CSS_values_and_units': 'CSS 값과 단위',
'Sizing_items_in_CSS': 'CSS에서 항목 크기 조정',
'Images_media_and_form_elements': '이미지, 미디어 및 양식 요소',
'Styling_tables': '표 꾸미기',
'Debugging_CSS': 'CSS 디버깅',
'Organizing_your_CSS': 'CSS 구성',
'Assessment_Fundamental_CSS_comprehension': '과제: 기본적인 CSS 이해',
'Assessment_Creating_fancy_letterheaded_paper': '과제: 이쁜 레터 모양 종이 만들기',
'Assessment_A_cool_looking_box': '과제: 멋진 박스 만들기 ',
'Styling_text': '텍스트 꾸미기',
'Styling_text_overview': '텍스트 꾸미기',
'Fundamental_text_and_font_styling': '기본적인 텍스트 및 글꼴 꾸미기',
'Styling_lists': '목록 꾸미기',
'Styling_links': '링크 꾸미기',
'Web_fonts': '웹 글꼴',
'Assessment_Typesetting_a_community_school_homepage': '과제: 학교 홈페이지 만들기',
'CSS_layout': 'CSS 레이아웃',
'CSS_layout_overview': 'CSS 레이아웃',
'Introduction_to_CSS_layout' : 'CSS 레이아웃 입문서',
'Normal_Flow' : '일반 대열',
'Flexbox': '플렉스박스',
'Grids' : '그리드',
'Floats': 'Floats',
'Positioning': '위치잡기',
'Multiple-column_layout': '다단 레이아웃',
'Responsive_design': '반응형 디자인',
'Beginners_guide_to_media_queries': '초보자를 위한 미디어 쿼리 안내서',
'Legacy_layout_methods': '레거시 레이아웃 메서드',
'Supporting_older_browsers': '이전 브라우저 지원',
'Assessment_Fundamental_Layout_Comprehension' : '과제 기본적인 레이아웃 사용하기',
'Reference': 'CSS 참고서',
'Guides': '안내서',
'Animations': '애니메이션',
'Using_CSS_animations': 'CSS 애니메이션 사용하기',
'Backgrounds_and_Borders': '배경과 보더',
'Using_multiple_backgrounds': '한 번에 여러 배경 사용하기',
'Resizing_background_images': '배경 이미지 크기 조정하기',
'Box_alignment': '박스 정렬',
'Box_alignment_in_block_layout': '블록 레이아웃 박스 정렬하기',
'Box_alignment_in_flexbox': '플렉스박스 박스 정렬하기',
'Box_alignment_in_grid_layout': '그리드 레이아웃 박스 정렬하기',
'Box_alignment_in_multi-column_layout': '다단 레이아웃 박스 정렬하기',
'Box_model': '박스 모델',
'Introduction_to_the_CSS_basic_box_model': 'CSS 기본 박스 모델 입문',
'Mastering_margin_collapsing': '여백 상쇄 정복',
'Columns': '다단 레이아웃',
'Basic_concepts_of_Multicol': '다단 레이아웃의 기본 개념',
'Styling_columns': '다단 레이아웃 꾸미기',
'Spanning_and_balancing': 'Spanning 과 balancing',
'Handling_overflow_in_Multicol': '다단 레이아웃에서 overflow 처리하기',
'Content_breaks_in_Multicol': '다단 레이아웃에서 컨텐츠 나누기',
'Conditional_rules': 'CSS에서 규칙 정의하기',
'Using_feature_queries': '기능 쿼리 사용하기',
'CSSOM_view': 'CSSOM view',
'Coordinate_systems': '좌표 시스템',
'Flexbox': '플렉스박스',
'Basic_concepts_of_Flexbox': '플렉스박스의 기본 개념',
'Comparison_with_other_layout_methods': '다른 레이아웃과 비교해보기',
'Aligning_items_in_a_flex_container': '항목 정렬하기',
'Ordering_flex_items': '항목 순서 정하기',
'Controlling_flex_item_ratios': '항목 비율 설정하기',
'Mastering_wrapping_of_flex_items': '항목 wrapping 정복하기',
'Typical_use_cases_of_Flexbox': '플렉스박스 적용 사례',
'Flow_layout': '플로 레이아웃',
'Block_and_Inline_layout_in_normal_flow': '일반 대열 속 블록 및 인라인 레이아웃',
'In_flow_and_Out_of_flow': '대열과 탈대열',
'Formatting_contexts_explained': '서식 상황 입문서',
'Flow_layout_and_writing_modes': '플로 레이아웃과 쓰기 모드',
'Flow_layout_and_overflow': '플로 레이아웃과 overflow',
'Fonts': '글꼴',
'OpenType_font_features_guide': '오픈타입 글꼴 기능 안내서',
'Variable_fonts_guide': '다양한 글꼴 안내서',
'Grid': '그리드',
'Basics_concepts_of_grid_layout': '그리드 레이아웃 기본 개념',
'Relationship_to_other_layout_methods': '그리드 레이아웃과 다른 레이아웃과의 관계성',
'Line-based_placement': '라인을 이용한 그리드 배치',
'Grid_template_areas': '그리드 템플릿 영역',
'Layout_using_named_grid_lines': '이름으로 레이아웃 정하기',
'Auto-placement_in_grid_layout': '그리드 레이아웃의 자동 배치',
'Box_alignment_in_grid_layout': '그리드 레이아웃의 박스 정렬',
'Grids_logical_values_and_writing_modes': '그리드, logical 값, 쓰기 모드',
'Grid_layout_and_accessibility': '그리드 레이아웃과 접근성',
'Grid_Layout_and_progressive_enhancement': '그리드 레이아웃과 꾸준한 발전 ',
'Realizing_common_layouts_using_grids': '자주 사용되는 레이아웃',
'Subgrid': '하위 그리드',
'Masonry_layout': 'Masonry 레이아웃',
'Images': '이미지',
'Using_CSS_gradients': 'CSS 그레이디언트 사용하기',
'Lists_and_counters': '리스트와 카운터',
'Using_CSS_counters': 'CSS 카운터 사용하기',
'Consistent_list_indentation': '리스트 들여쓰기',
'Logical_properties': 'Logical 속성',
'Basic_concepts': '기본 개념',
'Floating_and_positioning': 'Floating 과 positioning',
'Margins_borders_and_padding': '바깥여백(마진), 테두리(보더) 그리고 안쪽여백(패딩)',
'Sizing': '크기 조절하기',
'Media_queries': '미디어 쿼리',
'Using_media_queries': '미디어 쿼리 사용하기',
'Using_media_queries_for_accessibility': '접근성을 위한 미디어 쿼리 사용하기',
'Testing_media_queries_programmatically': '미디어 쿼리 테스트하기',
'Positioning': '위치 잡기',
'Understanding_CSS_z-index': 'CSS z-index 이해하기',
'Scroll_snap': '스크롤 스냅',
'Basic_concepts_of_scroll_snap': '스크롤 스냅 기본 개념',
'Shapes': '도형',
'Overview_of_shapes': '도형의 기본 개념',
'Shapes_from_box_values': 'CSS 박스 모델로 도형 만들기',
'Basic_shapes': '기본 도형들',
'Shapes_from_images': '이미지로 도형 만들기',
'Text': '텍스트',
'Wrapping_and_breaking_text': '텍스 포장하기 및 나누기',
'Transforms': '변형',
'Using_transforms': 'CSS 변형 사용하기',
'Transitions': '트랜지션',
'Using_transitions': 'CSS 트랜지션 사용하기',
'Layout_cookbook': '레이아웃 비법서',
'Media_objects': '미디어 객체',
'Columns': '열',
'Center_an_element': '아이템 중앙 정렬 하기',
'Sticky_footers': '바닥글 sticky 설정하기',
'Split_navigation': '네비게이션 나누기',
'Breadcrumb_navigation': '네비게이션 breadcrumb 설정하기',
'List_group_with_badges': '뱃지로 리스트 그룹화하기',
'Pagination': 'Pagination',
'Card': '카드',
'Grid_wrapper': '그리드 wrapper',
'Tools': '도구',
'Color_picker_tool': '색상 선택 도구',
'Border-radius_generator': 'Border-radius 생성기',
'Box-shadow_generator': '박스에 그림자 생성기',
'Border-image_generator' : '보더 이미지 생성기',
},
'pt-BR': {
'Tutorials': 'Tutoriais',
'CSS_basics': 'O básico de CSS',
'CSS_first_steps': 'CSS - primeiros passos',
'CSS_first_steps_overview': 'Visão geral das primeiras etapas com CSS',
'What_is_CSS': 'O que é CSS?',
'Getting_started_with_CSS': 'Iniciando com CSS',
'How_CSS_is_structured': 'como CSS é estruturado',
'How_CSS_works': 'Como CSS funciona',
'Assessment_Styling_a_biography_page': 'Avaliação: Estilizando uma página biográfica',
'CSS_building_blocks': 'CSS building blocks',
'CSS_building_blocks_overview': 'CSS building blocks overview',
'Cascade_and_inheritance': 'Cascade and inheritance',
'CSS_selectors': 'seletores CSS',
'The_box_model': 'The box model',
'Backgrounds_and_borders': 'Backgrounds and borders',
'Handling_different_text_directions': 'Tratamento de diferentes direções de texto',
'Overflowing_content': 'Overflowing content',
'CSS_values_and_units': 'Valores e unidades CSS',
'Sizing_items_in_CSS': 'Dimensionando itens em CSS',
'Images_media_and_form_elements': 'Images, media, and form elements',
'Styling_tables': 'Estilização de tabelas',
'Debugging_CSS': 'Debugging CSS',
'Organizing_your_CSS': 'Organize seu CSS',
'Assessment_Fundamental_CSS_comprehension': 'Assessment: Fundamental CSS comprehension',
'Assessment_Creating_fancy_letterheaded_paper': 'Assessment: Creating fancy letterheaded paper',
'Assessment_A_cool_looking_box': 'Assessment: A cool-looking box',
'Styling_text': 'Estilização de textos',
'Styling_text_overview': 'Visão geral da Estilização de textos',
'Fundamental_text_and_font_styling': 'Fundamentos da estilização de textos e fontes',
'Styling_lists': 'Estilização de listas',
'Styling_links': 'Estilização de links',
'Web_fonts': 'Fontes Web',
'Assessment_Typesetting_a_community_school_homepage': 'Avaliação: Tipografia para a página inicial da escola pública local',
'CSS_layout': 'Esquemas CSS',
'CSS_layout_overview': 'Visão geral de esquemas CSS',
'Introduction_to_CSS_layout' : 'Introdução a esquemas CSS',
'Normal_Flow': 'Normal Flow',
'Flexbox': 'Flexbox',
'Grids' : 'Grids',
'Floats': '"Floats" - Flutuando elementos',
'Positioning': 'Posicionamento',
'Multiple-column_layout': 'Multiple-column layout',
'Responsive_design': 'Responsive design',
'Beginners_guide_to_media_queries': 'Beginner\'s guide to media queries',
'Legacy_layout_methods': 'Legacy layout methods',
'Supporting_older_browsers': 'Supporting older browsers',
'Assessment_Fundamental_Layout_Comprehension': 'Assessment: Fundamental Layout Comprehension',
},
'ru': {
'Tutorials': 'Уроки',
'CSS_basics': 'Основы CSS',
'CSS_first_steps': 'Введение в CSS',
'CSS_first_steps_overview': 'Введение в CSS',
'What_is_CSS': 'Что такое CSS?',
'Getting_started_with_CSS': 'Начало работы с CSS',
'How_CSS_is_structured': 'Как структурирован CSS',
'How_CSS_works': 'Как работает CSS',
'Assessment_Styling_a_biography_page': 'Assessment: Styling a biography page',
'CSS_building_blocks': 'Устройство CSS',
'CSS_building_blocks_overview': 'Устройство CSS',
'Cascade_and_inheritance': 'Каскад и наследование',
'CSS_selectors': 'Селекторы CSS',
'The_box_model': 'Блочная модель',
'Backgrounds_and_borders': 'Фон и границы',
'Handling_different_text_directions': 'Изменение направления текста',
'Overflowing_content': 'Переполнение содержимого',
'CSS_values_and_units': 'Значения свойств CSS',
'Sizing_items_in_CSS': 'Изменение размеров в CSS',
'Images_media_and_form_elements': 'Элементы изображений, медиа и форм',
'Styling_tables': 'Стилизация таблиц',
'Debugging_CSS': 'Отладка CSS',
'Organizing_your_CSS': 'Организация CSS-кода',
'Assessment_Fundamental_CSS_comprehension': 'Assessment: Fundamental CSS comprehension',
'Assessment_Creating_fancy_letterheaded_paper': 'Assessment: Creating fancy letterheaded paper',
'Assessment_A_cool_looking_box': 'Assessment: A cool-looking box',
'Styling_text': 'Стилизация текста',
'Styling_text_overview': 'Стилизация текста',
'Fundamental_text_and_font_styling': 'Основы стилизирования текста и шрифта',
'Styling_lists': 'Стилизация списков',
'Styling_links': 'Стилизация ссылок',
'Web_fonts': 'Веб-шрифты',
'Assessment_Typesetting_a_community_school_homepage': 'Задание: Стилизирование школьного сайта',
'CSS_layout': 'CSS макет',
'CSS_layout_overview': 'CSS макет',
'Layout_introduction' : 'Введение в CSS вёрстку',
'Normal_Flow': 'Базовый поток',
'Flexbox': 'Flexbox',
'Grids' : 'Сетки',
'Floats': 'Float',
'Positioning': 'Позиционирование',
'Multiple-column_layout': 'Многоколоночная раскладка',
'Responsive_design': 'Отзывчивый дизайн',
'Beginners_guide_to_media_queries': 'Руководство для начинающих по медиа-запросам',
'Legacy_layout_methods': 'Устаревшие способы раскладки',
'Supporting_Older_Browsers': 'Поддержка старых браузеров',
'Assessment_Fundamental_Layout_Comprehension': 'Задание: Фундаментальное понимание раскладки',
'Reference': 'Справочники',
'Guides': 'Руководства',
'Animations': 'Анимации',
'Using_CSS_animations': 'Использование CSS-анимации',
'Backgrounds_and_Borders': 'Фоны и границы',
'Using_multiple_backgrounds': 'Множественные фоны',
'Resizing_background_images': 'Изменение размера фоновых изображений',
'Box_alignment': 'Выравнивание блоков',
'Box_alignment_in_block_layout': 'Выравнивание в блочной раскладке',
'Box_alignment_in_flexbox': 'Выравнивание в флексбокс-раскладке',
'Box_alignment_in_grid_layout': 'Выравнивание в грид-раскладке',
'Box_alignment_in_multi-column_layout': 'Выравнивание в мультиколоночной раскладке',
'Box_model': 'Блочная модель',
'Introduction_to_the_CSS_basic_box_model': 'Введение в блочную модель',
'Mastering_margin_collapsing': 'Схлопывание внешних отступов',
'Columns': 'Колонки',
'Basic_concepts_of_Multicol': 'Основные понятие мультиколонок',
'Styling_columns': 'Стилизация колонок',
'Spanning_and_balancing': 'Распределение и балансировка',
'Handling_overflow_in_Multicol': 'Обработка переполнения в мультиколонках',
'Content_breaks_in_Multicol': 'Разрывы содержимого в мультиколонках',
'Conditional_rules': 'Условные конструкции',
'Using_feature_queries': 'Использование feature queries (директива @supports)',
'CSSOM_view': 'CSSOM View',
'Coordinate_systems': 'Системы координат',
'Flexbox': 'Флексбокс',
'Basic_concepts_of_Flexbox': 'Основные понятия флексбокс',
'Comparison_with_other_layout_methods': 'Сравнение с другими способами раскладки',
'Aligning_items_in_a_flex_container': 'Выравнивание элементов во флекс-контейнере',
'Ordering_flex_items': 'Упорядочение флекс-элементов',
'Controlling_flex_item_ratios': 'Управление соотношением элементов вдоль главной оси',
'Mastering_wrapping_of_flex_items': 'Разбираемся с обёртыванием флекс-элементов',
'Typical_use_cases_of_Flexbox': 'Типовые варианты использования флексбокса',
'Flow_layout': 'Потоковая раскладка',
'Block_and_Inline_layout_in_normal_flow': 'Блочная и последовательная раскладка в базовом потоке',
'In_flow_and_Out_of_flow': 'В потоке и вне потока',
'Formatting_contexts_explained': 'Введение в контексты форматирования',
'Flow_layout_and_writing_modes': 'Потоковая раскладка и режимы записи',
'Flow_layout_and_overflow': 'Потоковая раскладка и переполнение',
'Fonts': 'Шрифты',
'OpenType_font_features_guide': 'Руководство по возможностям OpenType-шрифтов',
'Variable_fonts_guide': 'Руководство по переменным шрифтам',
'Grid': 'Грид',
'Basics_concepts_of_grid_layout': 'Основные понятия грид-раскладки',
'Relationship_to_other_layout_methods': 'Связь грид-раскладки с другими методами позиционирования',
'Line-based_placement': 'Расположение элементов по линиям с помощью сеток',
'Grid_template_areas': 'Шаблоны грид-областей',
'Layout_using_named_grid_lines': 'Раскладка с использованием именованных грид-линий',
'Auto-placement_in_grid_layout': 'Автоматическое расположение элементов в грид-раскладке',
'Box_alignment_in_grid_layout': 'Выравнивание блоков в грид-раскладке',
'Grids_logical_values_and_writing_modes': 'Сетки, логические значения и режимы записи',
'Grid_layout_and_accessibility': 'Грид-раскладка и доступность',
'Grid_Layout_and_progressive_enhancement': 'Расположение сетки и постепенное улучшение',
'Realizing_common_layouts_using_grids': 'Реализация общих макетов с использованием грид-раскладки',
'Subgrid': 'Subgrid',
'Masonry_layout': 'Masonry-раскладка',
'Images': 'Изображения',
'Using_CSS_gradients': 'Использование CSS-градиентов',
'Lists_and_counters': 'Списки и счетчики',
'Using_CSS_counters': 'CSS счётчики',
'Consistent_list_indentation': 'Последовательный отступ в списке',
'Logical_properties': 'Логические свойства',
'Basic_concepts': 'Базовые понятие',
'Floating_and_positioning': 'Обтекание и позиционирование',
'Margins_borders_and_padding': 'Рамки, внешние и внутренние отступы',
'Sizing': 'Определение размеров',
'Media_queries': 'Медиа-запросы',
'Using_media_queries': 'Использование медиавыражений',
'Using_media_queries_for_accessibility': 'Использование медиавыражений для доступности',
'Testing_media_queries_programmatically': 'Тестирование медиавыражений программно',
'Positioning': 'Позиционирование',
'Understanding_CSS_z-index': 'Понимание CSS z-index',
'Scroll_snap': 'Scroll snap',
'Basic_concepts_of_scroll_snap': 'Базовые концепции CSS Scroll Snap',
'Shapes': 'Фигуры',
'Overview_of_shapes': 'Обзор фигур',
'Shapes_from_box_values': 'Фигуры из блочных значений',
'Basic_shapes': 'Основные фигуры',
'Shapes_from_images': 'Фигуры из изображений',
'Text': 'Текст',
'Wrapping_and_breaking_text': 'Перенос и разрыв текста',
'Transforms': 'Трансформации',
'Using_transforms': 'Использование трансформаций',
'Transitions': 'Переходы',
'Using_transitions': 'Использование CSS переходов',
'Layout_cookbook': 'Рецепты по раскладке',
'Media_objects': 'Медиа-объекты',
'Columns': 'Колонки',
'Center_an_element': 'Центрирование элемента',
'Sticky_footers': 'Липкий подвал',
'Split_navigation': 'Раздельная навигация',
'Breadcrumb_navigation': 'Хлебные крошки',
'List_group_with_badges': 'Группа списка со значками',
'Pagination': 'Постраничная навигация',
'Card': 'Карточка',
'Grid_wrapper': 'Обёртка сетки',
'Tools': 'Инструменты',
'Color_picker_tool': 'Инструмент выбора цвета',
'Border-radius_generator': 'Border-radius генератор',
'Box-shadow_generator': 'Генератор теней',
'Border-image_generator' : 'Генератор Border-image',
},
'zh-CN': {
'Tutorials': '教程',
'CSS_basics': 'CSS 基础',
'CSS_first_steps': 'CSS 第一步',
'CSS_first_steps_overview': 'CSS 第一步概述',
'What_is_CSS': '什么是 CSS',
'Getting_started_with_CSS': 'CSS 入门',
'How_CSS_is_structured': 'CSS 的结构是怎样的',
'How_CSS_works': 'CSS 是如何工作的',
'Assessment_Styling_a_biography_page': '测验：为传记页面添加样式',
'CSS_building_blocks': 'CSS 构建',
'CSS_building_blocks_overview': 'CSS 构建基础概述',
'CSS_selectors': 'CSS 选择器',
'Type_Class_and_ID_Selectors': '类型、类和 ID 选择器',
'Attribute_selectors': '属性选择器',
'Pseudo-classes_and_pseudo-elements': '伪类与伪元素',
'Combinators': '关系选择器',
'Cascade_and_inheritance': '层叠、优先级与继承',
'Cascade_layers': '层叠层',
'The_box_model': '盒子模型',
'Backgrounds_and_borders': '背景和边框',
'Handling_different_text_directions': '处理不同方向的文本',
'Overflowing_content': '溢出的内容',
'CSS_values_and_units': 'CSS 的值和单位',
'Sizing_items_in_CSS': '在 CSS 中调整大小',
'Images_media_and_form_elements': '图像、媒体和表单元素',
'Styling_tables': '样式化表格',
'Debugging_CSS': '调试 CSS',
'Organizing_your_CSS': '组织你的 CSS',
'Assessment_Fundamental_CSS_comprehension': '测验：基本的 CSS 理解',
'Assessment_Creating_fancy_letterheaded_paper': '测验：创建精美的信纸',
'Assessment_A_cool_looking_box': '测验：一个漂亮的盒子',
'Styling_text': '样式化文本',
'Styling_text_overview': '样式化文本概述',
'Fundamental_text_and_font_styling': '基础文本与字体样式化',
'Styling_lists': '样式化列表',
'Styling_links': '样式化链接',
'Web_fonts': 'Web 字体',
'Assessment_Typesetting_a_community_school_homepage': '测验：排版社区大学首页',
'CSS_layout': 'CSS 布局概述',
'CSS_layout_overview': 'CSS 布局概述',
'Introduction_to_CSS_layout' : 'CSS 布局简介',
'Normal_Flow': '一般的流布局',
'Flexbox': '弹性盒布局',
'Grids' : '网格布局',
'Floats': '浮动布局',
'Positioning': '定位',
'Multiple-column_layout': '多栏式布局',
'Responsive_design': '响应式布局',
'Beginners_guide_to_media_queries': '媒体查询入门指南',
'Legacy_layout_methods': '传统的布局方法',
'Supporting_older_browsers': '支持旧版浏览器',
'Assessment_Fundamental_Layout_Comprehension': '测验：对布局基础知识的理解',
'Reference': '参考',
'Guides': '指南',
'Animations': '动画',
'Using_CSS_animations': '运用 CSS 动画',
'Backgrounds_and_Borders': '背景和边框',
'Using_multiple_backgrounds': '多个背景的应用',
'Resizing_background_images': '重设背景图片的大小',
'Box_alignment': '盒子的对齐方式',
'Box_alignment_in_block_layout': '块布局中的盒对齐方式',
'Box_alignment_in_flexbox': '弹性盒布局中的盒对齐方式',
'Box_alignment_in_grid_layout': '网格布局中的盒对齐方式',
'Box_alignment_in_multi-column_layout': '多栏式布局中的盒对齐方式',
'Box_model': '盒模型',
'Introduction_to_the_CSS_basic_box_model': 'CSS 基本盒模型简介',
'Mastering_margin_collapsing': '外边距重叠',
'Colors': '颜色',
'Applying_color_to_HTML_elements_using_CSS': '使用 CSS 为 HTML 元素添加颜色',
'Web_Accessibility_Understanding_Colors_and_Luminance': 'Web 无障碍：理解颜色和亮度',
'Color_contrast': 'Web 无障碍：色彩对比度',
'Columns': '多栏式布局',
'Basic_concepts_of_Multicol': '多栏式布局的基础概念',
'Styling_columns': '多栏式布局的样式',
'Spanning_and_balancing': '多栏式布局中的跨列与平衡',
'Handling_overflow_in_Multicol': '处理多栏式布局的溢出',
'Content_breaks_in_Multicol': '多栏式布局中的内容换行',
'Conditional_rules': '条件规则',
'Using_feature_queries': '运用特性查询',
'CSSOM_view': 'CSS 对象模型视图',
'Coordinate_systems': '坐标系',
'Flexbox': '弹性盒布局',
'Basic_concepts_of_Flexbox': '弹性盒布局基础',
'Comparison_with_other_layout_methods': '与其他布局的比较',
'Aligning_items_in_a_flex_container': '弹性盒容器中的对齐方式',
'Ordering_flex_items': '弹性盒布局中的排序方式',
'Controlling_flex_item_ratios': '控制弹性盒子元素在主轴上的比例',
'Mastering_wrapping_of_flex_items': '包装弹性盒布局中的元素',
'Typical_use_cases_of_Flexbox': '经典的弹性盒布局示例',
'Flow_layout': '流式布局',
'Block_and_Inline_layout_in_normal_flow': '一般的流式布局中的块式和行式布局',
'In_flow_and_Out_of_flow': '应用或脱离流式布局',
'Formatting_contexts_explained': '格式化上下文简介',
'Flow_layout_and_writing_modes': '流式布局和书写模式',
'Flow_layout_and_overflow': '流式布局和溢出',
'Fonts': '字体',
'OpenType_font_features_guide': 'OpenType 字体特性指南',
'Variable_fonts_guide': '可变字体指南',
'Grid': '网格布局',
'Basics_concepts_of_grid_layout': '网格布局基础概念',
'Relationship_to_other_layout_methods': '和其他布局方法的联系',
'Line-based_placement': '基于网格线的定位',
'Grid_template_areas': '网格模板区域',
'Layout_using_named_grid_lines': '使用命名线布局',
'Auto-placement_in_grid_layout': '网格布局中的自动定位',
'Box_alignment_in_grid_layout': '网格布局中的盒模型对齐',
'Grids_logical_values_and_writing_modes': '网格、逻辑值和书写模式',
'Grid_layout_and_accessibility': '网格布局和无障碍',
'Grid_Layout_and_progressive_enhancement': '网格布局和渐进增强',
'Realizing_common_layouts_using_grids': '运用网格布局实现常见布局',
'Subgrid': '子网格',
'Masonry_layout': 'Masonry 布局',
'Images': '图片',
'Using_CSS_gradients': '使用 CSS 渐变',
'Lists_and_counters': '列表和计数器',
'Using_CSS_counters': '使用 CSS 计数器',
'Consistent_list_indentation': '使列表缩进一致',
'Logical_properties': '逻辑属性',
'Basic_concepts': '基础概念',
'Floating_and_positioning': '浮动和定位',
'Margins_borders_and_padding': '内外边距和边框',
'Sizing': '调整尺寸',
'Math_functions': '数学函数',
'Using_CSS_math_functions': '使用 CSS 数学函数',
'Media_queries': '媒体查询',
'Using_media_queries': '使用媒体查询',
'Using_media_queries_for_accessibility': '无障碍相关的媒体查询',
'Testing_media_queries_programmatically': '运用编程方法测试媒体查询',
'Nesting': '嵌套样式规则',
'Using_CSS_nesting': '使用 CSS 嵌套',
'Nesting_and_specificity': '嵌套与优先级',
'Nesting_at-rules': '嵌套 @ 规则',
'Positioning': '定位',
'Understanding_CSS_z-index': '理解 CSS z-index',
'Scroll_snap': '滚动吸附',
'Basic_concepts_of_scroll_snap': '滚动吸附的基本概念',
'Shapes': '形状',
'Overview_of_shapes': '形状概述',
'Shapes_from_box_values': '使用 box 值指定形状',
'Basic_shapes': '基本形状',
'Shapes_from_images': '从图片中指定形状',
'Text': '文本',
'Wrapping_and_breaking_text': '包装文本和文本断行',
'Transforms': '变换',
'Using_transforms': '使用变换',
'Transitions': '过渡',
'Using_transitions': '使用过渡',
'Layout_cookbook': '布局手册',
'Media_objects': '媒体对象',
'Columns': '多列',
'Center_an_element': '居中一个元素',
'Sticky_footers': '粘性页脚',
'Split_navigation': '分离式导航',
'Breadcrumb_navigation': '面包屑导航',
'List_group_with_badges': '带有图标的列表',
'Pagination': '分页',
'Card': '卡片',
'Grid_wrapper': '网格布局包装器',
'Tools': '工具',
'Color_picker_tool': '取色器',
'Border-radius_generator': '圆角边框生成器',
'Box-shadow_generator': 'Box shadow 生成器',
'Border-image_generator' : '图片边框生成器',
},
'zh-TW': {
'Tutorials': '教程',
'CSS_basics': 'CSS 基礎',
'CSS_first_steps': 'CSS first steps',
'CSS_first_steps_overview': 'CSS first steps overview',
'What_is_CSS': 'What is CSS?',
'Getting_started_with_CSS': 'Getting started with CSS',
'How_CSS_is_structured': 'How CSS is structured',
'How_CSS_works': 'How CSS works',
'Assessment_Styling_a_biography_page': 'Assessment: Styling a biography page',
'CSS_building_blocks': 'CSS building blocks',
'CSS_building_blocks_overview': 'CSS building blocks overview',
'Cascade_and_inheritance': 'Cascade and inheritance',
'CSS_selectors': 'CSS selectors',
'The_box_model': 'The box model',
'Backgrounds_and_borders': 'Backgrounds and borders',
'Handling_different_text_directions': 'Handling different text directions',
'Overflowing_content': 'Overflowing content',
'CSS_values_and_units': 'CSS values and units',
'Sizing_items_in_CSS': 'Sizing items in CSS',
'Images_media_and_form_elements': 'Images, media, and form elements',
'Styling_tables': 'Styling tables',
'Debugging_CSS': 'Debugging CSS',
'Organizing_your_CSS': 'Organizing your CSS',
'Assessment_Fundamental_CSS_comprehension': 'Assessment: Fundamental CSS comprehension',
'Assessment_Creating_fancy_letterheaded_paper': 'Assessment: Creating fancy letterheaded paper',
'Assessment_A_cool_looking_box': 'Assessment: A cool-looking box',
'Styling_text': '樣式化文字',
'Styling_text_overview': '樣式化文字概述',
'Fundamental_text_and_font_styling': '基礎的文字與字型樣式化',
'Styling_lists': '樣式化列表',
'Styling_links': '樣式化連結',
'Web_fonts': 'Web 字型',
'Assessment_Typesetting_a_community_school_homepage': '練習：設定社區大學首頁的版面',
'CSS_layout': 'CSS 版面配置',
'CSS_layout_overview': 'CSS 版面配置概述',
'Normal_Flow': 'Normal Flow',
'Flexbox': '彈性區塊',
'Grids' : '格線',
'Floats': '浮動',
'Positioning': '定位',
'Multiple-column_layout': 'Multiple-column layout',
'Responsive_design': 'Responsive design',
'Beginners_guide_to_media_queries': 'Beginner\'s guide to media queries',
'Legacy_layout_methods': 'Legacy layout methods',
'Supporting_older_browsers': 'Supporting older browsers',
'Assessment_Fundamental_Layout_Comprehension': 'Assessment: Fundamental Layout Comprehension',
}
});
const locale = env.locale;
const learnURL = `/${locale}/docs/Learn/`;
const cssURL = `/${locale}/docs/Web/CSS/`;
const accessibilityURL = `/${locale}/docs/Web/Accessibility/`;
const htmlEscape = mdn.htmlEscape;
const hasTag = page.hasTag;
const rtlLocales = ['ar', 'he', 'fa'];
const pageList = await page.subpagesExpand('/en-US/docs/Web/CSS');
// Some functions are at depth two.
// Example: https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/hsl
pageList.push(...pageList.map((page) => page.subpages).flat());
const standardPages = pageList.filter(page => !hasTag(page, "Non-standard"));
const groups = [];
let properties = [];
const selectors = [];
const combinators = [];
const pseudoClasses = [];
const pseudoElements = [];
const atRules = [];
const functions = [];
const types = [];
for (const page of standardPages) {
switch(page.pageType) {
case "css-module":
groups.push(page);
break;
case "css-shorthand-property":
case "css-property":
properties.push(page);
break;
case "css-selector":
selectors.push(page);
break;
case "css-combinator":
combinators.push(page);
break;
case "css-pseudo-class":
pseudoClasses.push(page);
break;
case "css-pseudo-element":
pseudoElements.push(page);
break;
case "css-at-rule":
atRules.push(page);
break;
case "css-function":
functions.push(page);
break;
case "css-type":
types.push(page);
break;
}
}
const sortByTitle = (a, b) => a.title.localeCompare(b.title);
properties.sort(sortByTitle);
functions.sort(sortByTitle);
function smartLink(href, title, content, subpath) {
let basepath = subpath;
let ignoreFlawMacro = "CSSRef";