logo

איך למרכז טבלה ב-CSS?

השימוש בטבלאות בעיצוב אתר אינטרנט הוא משימה מרגשת. כברירת מחדל, היישור של טבלה הוא לכיוון שמאל, אך באמצעות ה- שולים נכס ב-CSS, נוכל ליישר אותו במרכז.

אם נקבע את הערך של שוליים-שמאליים ו שוליים-ימין ל אוטומטי , ואז הדפדפנים מציגים את הטבלה במרכז. אנחנו יכולים להשתמש במאפיין הקיצור שולים והגדר אותו ל אוטומטי ליישור הטבלה במרכז במקום להשתמש ב- שוליים-שמאליים ו שוליים-ימין תכונה.

מספרים ראשוניים לתכנות ג'אווה

במקום ליישר את הטבלה למרכז, ה יישור טקסט: מרכז; מאפיין מרכז רק את תוכן הטבלה, כגון הטקסט בתוך הטבלה.

בואו נבין זאת באמצעות איור.

דוגמא

בדוגמה זו אנו משתמשים ב- יישור טקסט: מרכז; מאפיין למרכז את התוכן בתוך הטבלה ו שוליים-שמאלי: אוטומטי; ו שוליים-ימין: אוטומטי; למרכז את השולחן.

Java string indexof
 table, th, td { border: 1px solid black; margin-left: auto; margin-right: auto; border-collapse: collapse; width: 500px; text-align: center; font-size: 20px; } <table class="table"> <tr> <th>First_Name</th> <th>Last_Name</th> <th>Subject</th> <th>Marks</th> </tr> <tr> <td>James</td><td>Gosling</td><td>Maths</td><td>92</td> </tr> <tr> <td>Alan</td><td>Rickman</td><td>Maths</td><td>89</td> </tr> <tr> <td>Sam</td><td>Mendes</td><td>Maths</td><td>82</td> </tr> </table> 
בדוק את זה עכשיו

תְפוּקָה

איך למרכז טבלה ב-CSS?