设计具有3D效果的桌子

Question

我尝试做一个小论坛，对网页设计进行一些培训。如何将表格设计更改为具有3维（3D）表格？或者，如果有任何解决方案来改进其设计，那可能会更好！

否则，欢迎任何批评！

/* Tableaux -------------------------------------------------------------------------------------*/
table {
    border-collapse: collapse;
}

pair {
    background-color: #efefef;
}

tr.impair {
    background-color: #fff;
}

th {
    color: #D89845;
    border: 1px solid #D89845;
    padding: 5px;
    font: normal 8pt verdana, helvetica, sans-serif;
}

td {
    border: 1px solid #ddd;
    padding: 5px;
    font: normal 8pt verdana, helvetica, sans-serif;
}

PS：我将保留最佳建议作为主题的验证。

提前致谢。

Answer 1

你可以使用box-shadow是给任何物体3d外观和最佳解决方案的最佳解决方案。感觉。

  

box-shadow使用浏览器specipic前缀，如-webkit，-o，-moz等。在这里，我给出了一个链接，您可以在其中找到更多关于它的信息。可以研究它是如何工作的。我也多次创造出这种只有3d感觉的物体   Link to box-shadow

Answer 2

也许你可以做任何事情，

    CSS:
.gridtable {
border:1px solid #000000;
height:149px;
width:342px;
overflow-x: scroll;
}
.fixedcell {
height:30px;
padding:0 2 0 2px;
background-color:#C2BFA5;
border-left:1px solid #E1E0D2;
border-top:1px solid #E1E0D2;
border-right:1px solid #8D8961;
border-bottom:1px solid #8D8961;
}
.gridcell {
height:30px;
background-color:#ffffff;
padding:0 2 0 2px;
border-right:1px solid #C0C0C0;
border-bottom:1px solid #C0C0C0;
}

修改 链接到3d效果：http://www.w3schools.com/cssref/pr_border-style.asp