Làm thế nào để đặt bảng ở giữa trang bằng cách sử dụng CSS?

Tôi đang sử dụng mã sau đây. Làm thế nào để đặt bảng này ở giữa trang bằng cách sử dụng CSS?Làm thế nào để đặt bảng ở giữa trang bằng cách sử dụng CSS?

<html> 
<head> 
    <link rel="stylesheet" type="text/css" href="styles.css" /> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <title>The Main Page</title> 
</head> 
<body> 
    <table> 
      <tr> 
       <td><button class="lightSquare"></button></td> 
       <td><button class="darkSquare"></button></td> 
       <td><button class="lightSquare"></button></td> 
       <td><button class="darkSquare"></button></td> 
       <td><button class="lightSquare"></button></td> 
       <td><button class="darkSquare"></button></td> 
       <td><button class="lightSquare"></button></td> 
       <td><button class="darkSquare"></button></td> 
      </tr> 

    </table> 
     </body> 
    </html>

Nguồn

2012-02-22 CodeBlue

Duplicate của nhiều câu hỏi khác ví dụ http://stackoverflow.com/questions/2281087/center-a-div-in-css – jacktheripper

nằm ngang ở giữa? theo chiều dọc được đặt ở giữa? cả hai? –

Cả hai chiều ngang và theo chiều dọc – CodeBlue

html, body { 
    width: 100%; 
} 
table { 
    margin: 0 auto; 
}

Ví dụ JSFiddle

yếu tố khối theo chiều dọc sắp xếp không phải là điều tầm thường nhất để làm. Một số phương pháp dưới đây.

Nguồn

2012-02-22 20:59:19

Hey, nhưng điều này chỉ tập trung theo chiều ngang và không theo chiều dọc. Ngoài ra, lề là gì: 0 tự động? – CodeBlue

@CodeBlue - sau đó xem: http://stackoverflow.com/questions/1909753/vertically-align-div-no-tables – JonH

Bạn có thể thử bằng cách sử dụng CSS sau:

table { 
    margin: 0px auto;    
}

Nguồn

2012-02-22 20:59:46 DarkAjax

Một số băng thông có thể được lưu bằng cách xóa 'px'. – Stephan

<html> 
<head> 
<meta charset="ISO-8859-1"> 
<style type="text/css"> 
table.center { 
    margin-left: auto; 
    margin-right: auto; 
} 
</style> 
<title>Table with css</title> 
</head> 
<body> 
<table class="center"> 
    <tr> 
    <th>SNO</th> 
    <th>Address</th> 
    </tr> 
    <tr> 
    <td>1</td> 
    <td>yazali</td> 
    </tr> 
</table> 

</body> 
</html>

Nguồn

2014-01-21 05:23:55 user2645333

Nếu bạn nơi hỏi về bảng để hoàn thành trung tâm, giống như một số điều trong tổng số trung tâm., bạn có thể áp dụng con cá tuyết sau e.

margin: 0px auto; 
margin-top: 13%;

mã này trong css sẽ cho phép bạn đặt bảng giống như nổi. Hãy cho tôi biết nếu nó giúp bạn.

Nguồn

2015-03-16 09:30:42

chỉ cần đặt nó trong div sau đó kiểm soát mà div whit css:

<div class="your_position"> 
    <table> 
    </table> 
</div>

Nguồn

2015-04-07 11:48:45

1) Thiết lập sự liên kết ngang để tự động trong CSS

margin-left: auto; margin-right: auto;

2) Nhận liên kết dọc vào giữa trang thêm sau vào css

html, body { width: 100%; }

Ví dụ:

<html> 
<head> 
<meta charset="ISO-8859-1"> 
<style type="text/css"> 
table.center { 
    margin-left: auto; 
    margin-right: auto; 
} 

html, body { 
    width: 100%; 
} 

</style> 
<title>Table with css</title> 
</head> 
<body> 
<table class="center"> 
     <tr> 
      <td><button class="lightSquare"></button></td> 
      <td><button class="darkSquare"></button></td> 
      <td><button class="lightSquare"></button></td> 
      <td><button class="darkSquare"></button></td> 
      <td><button class="lightSquare"></button></td> 
      <td><button class="darkSquare"></button></td> 
      <td><button class="lightSquare"></button></td> 
      <td><button class="darkSquare"></button></td> 
     </tr> 
</table> 

</body> 
</html>

Nguồn

2015-04-15 06:19:07 Gopal00005

Đã bị mắc kẹt trong cùng một tình huống vì xung đột HTML4 và HTML5 và 'alignment =" center "' là tuyệt đối trong HTML5. – Gopal00005

Làm thế nào để đặt bảng ở giữa trang bằng cách sử dụng CSS?

Trả lời

Các vấn đề liên quan