וועב פּלאַן האט שטענדיק באַראָוד פּרינסיפּאַלס און דעפֿיניציע פון דער וועלט פון גראַפיק און דרוקן פּלאַן. דאָס איז ספּעציעל אמת ווען עס קומט צו וועב טיפּאָגראַפי און די וועג אין וואָס מיר באַקומען לעטטערפאָרמס אויף אונדזער וועב זייַטלעך. די פּאַראַללעלס זענען נישט שטענדיק 1-1 איבערזעצונגען, אָבער איר קענען אַוואַדע זען ווו איינער דיסציפּלין האט ינפלוענסט די אנדערע. דאָס איז ספּעציעל קענטיק ווען איר באַטראַכטן די שייכות צווישן דעם טראדיציאנעלן טאַפּאַגראַפי טערמין "לידינג" און די CSS פאַרמאָג באקאנט ווי "שורה-הייך."
דער ציל פון לידינג
ווען מענטשן געניצט צו מאַניואַלי כאַנדסעט מעטאַל אָדער ווודאַן אותיות אין סדר צו מאַכן די טיפּאָגראַפי פֿאַר אַ געדרוקט בלאַט, דין ברעקלעך פון פירן זענען געשטעלט צווישן האָריזאָנטאַל שורות פון טעקסט צו שאַפֿן ספּייסינג צווישן די שורות. אויב איר געוואלט אַ ביגער פּלאַץ, איר וואָלט אַרייַנשטעלן מער ברעקלעך פון פירן. דעם איז ווי דער טערמין "לידינג" איז געווען קוינד. אויב איר געקוקט אַרויף די טערמין "לידינג" אין אַ בוך וועגן טיפּאָגראַפיק פּלאַן און פּרינסיפּאַלס, עס וואָלט לייענען עפּעס צו די ווירקונג פון - "די ווייַטקייט צווישן די בייסאַלינז פון סאַקסעסיוו שורות פון טיפּ."
לידינג אין וועב דיזיין
אין דיגיטאַל פּלאַן, די טערמין לידינג איז נאָך געניצט צו אָפּשיקן צו די ספּייסינג צווישן שורות פון טעקסט. פילע מגילה נוצן דעם פּינטלעך טערמין, אַפֿילו כאָטש פאַקטיש פירן איז דאָך נישט געניצט אין יענע מגילה.טהיס איז אַ גרויס בייַשפּיל פון נייַע פארמען פון פּלאַן באַראָוינג געדאנקען פון טראדיציאנעלן, אַפֿילו כאָטש די פּינטלעך ימפּלאַמענטיישאַן פון דעם פּרינציפּ האט געביטן.
ווען עס קומט צו וועב פּלאַן, עס איז קיין CSS פאַרמאָג פֿאַר "לידינג." אַנשטאָט דעם CSS פאַרמאָג וואָס וואָלט שעפּן דעם וויסואַל אַרויסווייַז פון טעקסט איז גערופן שורה-הייך. אויב איר ווילן אייער טעקסט צו האָבן אַן עקסטרע אָרט צווישן האָריזאָנטאַל שורות פון טעקסט, איר וואָלט נוצן דעם פאַרמאָג. פֿאַר בייַשפּיל, זאָגן איר געוואלט צו פאַרגרעסערן די שורה-הייך פֿאַר אַלע פּאַראַגראַפס ין די <הויפּט> עלעמענט פון דיין פּלאַץ , איר קען טאָן אַזוי ווי דאָס:
הויפּט פּ (שורה-הייך: 1.5; }דעם וואָלט איצט זיין 1.5 מאל די נאָרמאַל שורה הייך, באזירט אויף די פעליקייַט שריפֿט גרייס פון דער בלאַט (וואָס איז נאָרמאַלי 16 פּקס).
ווען איר נוצן Line-Height
ווי דיטיילד אויבן, שורה-הייך איז צונעמען צו נוצן צו אָרט די שורות פון טעקסט אין פּאַראַגראַפס אָדער אנדערע בלאַקס פון טעקסט. אויב עס איז אויך קליין פּלאַץ צווישן שורות, די טעקסט קענען זיין דזשאַמבאַלד און שווער צו לייענען פֿאַר וויוערז צו דיין פּלאַץ. סימילאַרלי, אויב די שורות זענען ספּייסט אויך ווייַט באַזונדער אויף דעם בלאַט, דער נאָרמאַל לויפן פון לייענען וועט זיין ינטעראַפּטיד און לייענער וועלן האָבן קאָנפליקט מיט דיין טעקסט פֿאַר דעם סיבה. דעריבער, איר דאַרפֿן צו געפֿינען די צונעמען גרייס פון שורה-הייך ספּייסינג צו נוצן. איר קענען אויך פּרובירן דיין פּלאַן מיט פאַקטיש וסערס צו באַקומען זייער באַמערקונגען אויף די לייענען פון די בלאַט .
ווען ניט צו נוצן שורה-הייך
דו זאלסט נישט צעמישן די שורה-הייך מיט די וואַטן אָדער מאַרדזשאַנז אַז איר וואָלט נוצן צו לייגן ווהיטעספּאַסע צו דיין בלאַט ס פּלאַן, אַרייַנגערעכנט אונטער כעדינג אָדער פּאַראַגראַפס. אַז ספּייסינג איז ניט לידינג, און דעריבער עס איז ניט כאַנדאַלד דורך שורה-הייך.
אויב איר ווילן צו לייגן אָרט אונטער עטלעכע טעקסט עלעמענטן, איר וואָלט נוצן מאַרדזשאַנז אָדער וואַטן. גיי צוריק צו די פריערדיקע קסס משל מיר געוויינט, מיר קען לייגן דעם:
הויפּט פּ (שורה-הייך: 1.5; גרענעץ-דנאָ: 24 פּקס; }דעם וואָלט האָבן די 1.5 שורה הייך צווישן שורות פון טעקסט פֿאַר אונדזער פּאַראַגראַף בלאַט (די ין ין די <הויפּט> עלעמענט). די זעלבע פּאַראַגראַפס וואָלט אויך האָבן 24 בילדצעלן פון ווהיטעספּאַסע ונטער יעדער פון זיי, אַלאַוינג פֿאַר וויזשאַוואַל ברייקס אַז לאָזן לייענער צו לייכט ידענטיפיצירן איינער פּאַראַגראַף פון אנדערן און מאַכן וועבזייַטל לייענען גרינגער צו טאָן. איר קען אויך נוצן די וואַטן פאַרמאָג אין פּלאַץ פון מאַרדזשאַנז דאָ:
הויפּט פּ (שורה-הייך: 1.5; padding-bottom: 24px; }אין כּמעט אַלע קאַסעס, דאָס וואָלט אַרויסווייַזן די זעלבע ווי די פריערדיקע קסס.
זאָגן איר געוואלט צו לייגן ספּייסינג ונטער רשימה זאכן וואָס זענען ין אַ רשימה מיט אַ סאָרט פון "סערוויסעס-מעניו", איר וואָלט נוצן מאַרדזשאַנז אָדער וואַטן צו טאָן אַזוי, נישט שורה הייך. אזוי דאָס וואָלט זיין צונעמען.
.services-menu li {