ווי צו לייגן אינערלעכער שורות (Borders) אין אַ טיש מיט CSS

לערנען ווי צו שאַפֿן אַ קסס טיש גרענעץ אין בלויז פינף מינוט

איר קען האָבן געהערט אַז CSS און HTML טישן טאָן ניט מישן. דאס איז פשוט נישט אמת. יאָ, ניצן HTML טישן פֿאַר אויסלייג איז ניט מער אַ וועב פּלאַן בעסטער פּראַקטיס, ווייל עס איז געווען ריפּלייסט דורך CSS אויסלייג סטיילז, אָבער טישן זענען נאָך די ריכטיק מאַרקאַפּ צו נוצן צו לייגן טאַבולאַר דאַטן צו אַ וועבפּאַגע.

צום באַדויערן, ווייַל אַזוי פילע וועב פּראָפעססיאָנאַלס האָבן אַוועקגענומען פון טישן טראכטן אַז זיי זענען גיפט, פילע פון ​​די פּראָפעססיאָנאַלס האָבן ביסל דערפאַרונג ארבעטן מיט דעם פּראָסט HTML עלעמענט און די געראַנגל ווען זיי האָבן צו באַשיצן זיי אויף אַ וועבפּאַגע. פֿאַר בייַשפּיל, אויב איר האָבן אַ טיש אויף אַ בלאַט און איר ווילן צו לייגן ינערלעך שורות צו די טיש סעלז.

CSS טאַבלע באָרדערס

ווען איר נוצן CSS צו לייגן געמארקן צו טישן, עס נאָר לייגן די גרענעץ אַרום די אַרויס פון די טיש. אויב איר ווילן צו לייגן אינעווייניק שורות צו די יחיד סעלז פון דעם טיש, איר דאַרפֿן צו לייגן געמארקן צו די ינלענדיש קסס עלעמענטן. איר קענען אויך נוצן די הר קוויטל צו לייגן שורות ין יחיד סעלז.

אין סדר צו צולייגן די סטיילז באדעקט אין דעם אַרטיקל, איר זאָל דאָך האָבן אַ טיש אויף דיין וועב בלאַט. איר זאָל מאַכן אַ נוסח בויגן ווי אַן אינערלעכער נוסח בויגן אין די קאָפּ פון דיין דאָקומענט (איר וועט מסתּמא נאָר טאָן דאָס אויב דיין "פּלאַץ" איז אַ איין בלאַט) אָדער אַטאַטשט צו די דאָקומענט ווי אַ פונדרויסנדיק נוסח בויגן (דאָס איז וואָס איר וועט טאָן אויב דיין פּלאַץ איז קייפל בלעטער - אַלאַוינג צו אַלע וועבזייטל פון איין פונדרויסנדיק בויגן). איר וועט שטעלן די סטיילז צו לייגן ינלענדיש שורות אין אַז נוסח בויגן.

איידער איר אָנהייב

ערשטער איר דאַרפֿן צו באַשליסן ווו איר ווילן די שורות צו דערשייַנען אין דיין טיש. איר האָבן עטלעכע אָפּציעס, אַרייַנגערעכנט:

איר קענען אויך שטעלע די שורות אַרום יחיד סעלז אָדער ין יחיד סעלז.

ווי צו לייגן שורות אַרום אַלע די סעלז אין אַ טיש

צו לייגן שורות אַרום אַלע סעלז אין דיין טיש, שאפן די גריד-ווי ווירקונג, לייגן די פאלגענדע צו דיין נוסח בלאַט:

td, th {
גרענעץ: האַרט 1 פּקס שוואַרץ;
}

ווי צו לייגן לינעס צווישן נאָר די קאָלומנס אין אַ טיש

צו לייגן שורות צווישן די שפאלטן (דאָס קריייץ ווערטיקאַל שורות וואָס לויפן פון שפּיץ צו דנאָ אויף די טיש ס שפאלטן), לייגן די פאלגענדע צו דיין סטיל בלאַט:

td, th {
ברעג-לינקס: האַרט 1 פּקס שוואַרץ;
}

דעריבער, אויב איר טאָן ניט וועלן זיי צו ווייַזן אויף דער ערשטער זייַל, איר דאַרפֿן צו לייגן אַ קלאַס צו די טה און טד סעלז. אין דעם בייַשפּיל, מיר יבערנעמען מיר האָבן אַ סאָרט פון קיין-גרענעץ אויף די סעלז און מיר באַזייַטיקן די גרענעץ מיט דעם מער ספּעציפיש CSS הערשן. אַזוי דאָ איז די HTML קלאַס מיר וואָלט נוצן:

קלאַס = "קיין-גרענעץ">

און דעמאָלט מיר קען לייגן די ווייַטערדיק נוסח צו אונדזער נוסח בויגן:

.no-border {
border-left: none;
}

ווי צו לייגן לינעס צווישן נאָר די ראָוז אין אַ טיש

ווי מיט אַדינג שורות צווישן די שפאלטן, איר קענען טאָן דאָס מיט בלויז איין פּשוט סטיל צוגעגעבן צו דיין נוסח בלאַט. די ונטער CSS וואָלט לייגן ווערטיקאַל שורות צווישן יעדער רודערן פון אונדזער טיש:

tr {
ברעג-דנאָ: האַרט 1 פּקס שוואַרץ;
}

און צו באַזייַטיקן די גרענעץ פון די דנאָ פון די טיש, איר וואָלט ווידער לייגן אַ סאָרט צו דעם טר טאַגס:

קלאַס = "קיין-גרענעץ">

לייג די ווייַטערדיקע סטיל צו דיין נוסח בלאַט:

.no-border {
border-bottom: none;
}

ווי צו לייגן לינעס צווישן ספּעציפיש קאָלומנס אָדער ראָוז אין אַ טיש

אויב איר נאָר ווילן שורות צווישן ספּעציפיש ראָוז אָדער שפאלטן, איר דאַרפֿן צו נוצן אַ סאָרט אויף די סעלז אָדער ראָוז. אַדדינג אַ שורה צווישן שפאלטן איז אַ ביסל מער שווער ווי צווישן ראָוז ווייַל איר האָבן צו לייגן די קלאַס צו יעדער צעל אין דעם זייַל. אויב דיין טיש איז אויטאָמאַטיש געשאפן פון אַ קמס פון עטלעכע מין , דאָס קען נישט זיין מעגלעך, אָבער אויב איר זענען האַנט קאַדינג די בלאַט, איר קען לייגן צונעמען קלאסן ווי דארף צו דערגרייכן דעם ווירקונג.

קלאַס = "זייַט-גרענעץ">

אַדדינג שורות צווישן ראָוז איז פיל גרינגער, ווי איר קענען נאָר לייגן די סאָרט צו די רודערן איר ווילן די שורה אויף.

קלאַס = "גרענעץ-דנאָ">

דערנאָך לייגן די קסס צו דיין נוסח בלאַט:

.באָרדער-זייַט {
ברעג-לינקס: האַרט 1 פּקס שוואַרץ;
}
.באָרדער-דנאָ {
ברעג-דנאָ: האַרט 1 פּקס שוואַרץ;
}

ווי צו לייגן שורות Around Individual Cells אין אַ טיש

צו לייגן שורות אַרום יחיד סעלז, איר שטעלן אַ קלאַס צו די סעלז איר ווילן אַ גרענעץ אַרום:

קלאַס = "גרענעץ">

און דעמאָלט לייגן די ווייַטערדיק CSS צו דיין נוסח בלאַט:

.באָרדער {
גרענעץ: האַרט 1 פּקס שוואַרץ;
}

ווי צו לייגן לינעס ין ינדיווידואַל סעלז אין אַ טיש

אויב איר ווילן צו לייגן שורות ין דער אינהאַלט פון אַ צעל, די יזיאַסט וועג צו טאָן דעם איז מיט די האָריזאָנטאַל הערשן קוויטל ( <הר> ).

נוציק עצות

אויב איר באמערקט גאַפּס אין דיין געמארקן, איר זאָל מאַכן זיכער אַז די גרענעץ-ייַנבראָך נוסח איז שטעלן אויף דיין טיש. לייג די פאלגענדע צו דיין נוסח בלאַט:

טיש {
גרענעץ-ייַנבראָך: ייַנבראָך;
}

איר קענען ויסמייַדן אַלע די אויבן CSS און נוצן די גרענעץ אַטריביוט אין דיין טיש קוויטל. פאַרשטיין אַז זיין אַטריביוט, בשעת ניט דעפּרעסאַטעד, איז באטייטיק ווייניקער פלעקסאַבאַל ווי קסס, ווי איר קענען בלויז דעפינירן די ברייט פון די גרענעץ און קענען נאָר האָבן עס אַרום אַלע סעלז פון די טיש אָדער גאָרניט.