CSS padding איז איינער פון די פּראָפּערטיעס פון די CSS קעסטל מאָדעל . דעם שאָרטהאַנד פאַרמאָג שטעלט די וואַטן אַרום אַלע פיר זייטן פון אַ HTML עלעמענט. CSS padding קענען זיין געווענדט צו קימאַט יעדער HTML קוויטל (אַחוץ פֿאַר עטלעכע טיש). דערצו, אַלע פיר זייטן פון די עלעמענט קענען האָבן אַ אַנדערש ווערט.
CSS Padding Property
איר קענען נוצן די מנעמאַניק "טראָובלע" (אָדער "טריבבלע" פֿאַר איר שטערן טרעק פאַנס) צו נוצן די שאָרטהאַנד CSS padding פאַרמאָג. דאָס שטייט פֿאַר שפּיץ , רעכט , דנאָ , און לינקס , און עס רעפערס צו די סדר פון די וואַטן ברייטז איר שטעלן אין די שאָרטהאַנד פאַרמאָג. פֿאַר בייַשפּיל:
וואַטע: שפּיץ רעכט דנאָ לינקס; padding: 1px 2px 3px 6px;אויב איר געוויינט די וואַלועס וואָס זענען ליסטעד אויבן, עס וואָלט אַפּלייז אַ אַנדערש וואַטן ווערט צו יעדער זייַט פון וועלכער HTML עלעמענט איר זענען אַפּלייינג עס צו. אויב איר ווילן צו צולייגן די זעלבע וואַטן צו אַלע פיר זייטן, איר קענען פאַרפּאָשעטערן דיין קסס און נאָר שרייַבן איין ווערט:
padding: 12px;מיט אַז ליניע פון קסס, 12 פּיקסעלס פון וואַטן וואָלט אַפּלייז צו אַלע 4 זייטן פון דעם עלעמענט.
אויב איר ווילן די וואַטן צו זיין די זעלבע פֿאַר די שפּיץ און דנאָ און לינקס און רעכט, איר קענען שרייַבן צוויי וואַלועס:
וואַטן: 24 פּקס 48 פּקס;דער ערשטער ווערט (24 פּקס) וואָלט אַפּלייז צו די שפּיץ און דנאָ, און די רגע וואָלט זיין געווענדט צו די לינקס און רעכט.
אויב איר שרייַבן דרייַ וואַלועס, וואָס וועט מאַכן די האָריזאָנטאַל פּלאַדינג (לינקס און רעכט) די זעלבע, בשעת טשאַנגינג די שפּיץ און דנאָ:
וואַטן: שפּיץ רעכט-און-לינקס דנאָ; וואַטן: 0 פּקס 1 פּקס 3 פּקס;לויט די CSS קעסטל מאָדעל, פּלאַטפאָרמע איז קלאָוסאַסט צו די עלעמענט / צופרידן זיך. דעם מיטל אַז פּלאַטינג איז מוסיף צו אַן עלעמענט אין די צופרידן ברייט אָדער הייך און קיין גרענעץ וואַלועס איר נוצן. אויב די וואַטן איז באַשטימט צו נול, עס איז די זעלבע ווי די אינהאַלט.
CSS Padding וואַלועס
CSS וואַטן קענען נעמען קיין ניט-נעגאַטיוו לענג ווערט. זייט זיכער צו ספּעציפיצירן די מעזשערמאַנט, אַזאַ ווי פּקס אָדער עם. איר קענען אויך ספּעציפיצירן אַ פּראָצענט פֿאַר דיין וואַטן, וואָס וועט זיין אַ פּראָצענט פון די ברייט פון די עלעמענט מיט בלאָק. דעם כולל פֿאַר שפּיץ און דנאָ וואַטן. פֿאַר בייַשפּיל:
# קאַנטיינער {ברייט: 800 פּקס; הייך: 200 פּקס; } # קאַנטיינער p {ברייט: 400 פּקס; הייך: 75%; וואַטן: 25% 0; }די הייך פון די פּאַראַגראַף ין די # קאָנטאַינער עלעמענט וועט זיין 75% פון די # קאָנטאַינער 'ס הייך פּלוס 25% פון די ברייט פֿאַר די שפּיץ וואַטן און 25% פון די ברייט פֿאַר די דנאָ וואַטן. דאס טאָוטאַלז 300 + 200 + 200 = 700 פּקס.
עפפעקץ פון אַדדינג CSS פּאַדינג
אויף בלאָק-מדרגה עלעמענטן , די וואַטן איז געווענדט אויף די פיר זייטן. ווייַל דער עלעמענט איז אַ בלאָק אָדער קעסטל שוין, די וואַטן איז געווענדט צו די קעסטל זייטן.
ווען CSS פּאָלאָדינג איז מוסיף צו ינלינע עלעמענטן , עס קען זיין עטלעכע אָוווערלאַפּינג פון עלעמענטן אויבן און ונטער דער ינלענדיש עלעמענט אויב די ווערטיקאַל פּאַדס יקסיד די שורה הייך, אָבער עס וועט נישט שטופּן די שורה הייך אַראָפּ. האָריזאָנטאַל CSS וואַטן געווענדט צו ינלינע עלעמענטן וועט זיין צוגעגעבן צו די אָנהייב פון די עלעמענט און די סוף פון די עלעמענט. און די וואַטן קענען ייַנוויקלען שורות. אבער עס וועט נישט זיין צוגעשטעלט צו אַלע שורות פון אַ מאַלטי-שורה עלעמענט, אַזוי איר קענען נישט נוצן וואַטן צו ינדענט אַ סעגמענט פון מאַלטי-שורה ינלינע צופרידן.
אויך, אין CSS2.1, איר קענען נישט מאַכן קאַנטיינער בלאַקס ווו די ברייט דעפּענדס אויף אַן עלעמענט מיט פּערסענידזשיז פֿאַר ווידטס (אָדער וואַטן ברייטס). אויב איר טאָן דעם רעזולטאַט איז דיפיינד. בראַוזערז וועט נאָך אַרויסווייַזן די אינהאַלט, אָבער איר קען נישט באַקומען די רעזולטאטן איר זענען ווארטן. אויב איר טראַכטן וועגן אים, עס מאכט אַ זינען, ווי אויב דיין קאַנטיינער עלעמענט דאַרפֿן צו וויסן די ברייט פון זייַן קינד עלעמענטן אין סדר צו באַשליסן זייַן ברייט, אַזאַ ווי ווען עס טוט נישט האָבן אַ פאַרפעסטיקט ברייט, און איינער אָדער מער האט אַ ברייט באַשטימט ווי אַ פּראָצענט פון דעם קאַנטיינער עלעמענט, דאָס שטעלט אַרויף אַ קייַלעכיק קייט מיט קיין ענטפער. אויב איר נוצן פּערסענידזשיז פֿאַר ברייט פון עפּעס אויף דיין דאָקומענט, איר זאָל מאַכן זיכער אַז די עלטערן עלעמענט ברייט איז אויך דיפיינד.