css - 盒子容器如何做立体效果，如何选择颜色？

Question

如何使这个盒子的设计更好？将其页眉和页脚设为 3D，更好地选择颜色，...

我试过这个:

相关代码如下:

.boxfooter {
  display: block;
  border: 1px solid #eee;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  background-color: #fbfcfa;
  margin:0 0 0 0;
  padding: 1px;
  color:#8EA2AA;
}
.boxheader{
  margin:6px 0 0 0;
  font-size:20px;
  display: block;
  border: 1px solid #eee;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
  background-color: #fbfcfa;
  margin:0 0 0 0;
  padding:4px;
}
.box {
  background-color:#fbfcfa;
  overflow-y:scroll;
  display: block;
  margin:0 0 0 0;
  border-left: 1px solid #eee;
  border-right: 1px solid #eee;
  padding: 10px;
  color: #333;
}

Answer 1

如果你想让它更突出，那就选择像盒子阴影这样的东西。

box-shadow:0 0 10px #000000;

至于颜色，这完全取决于您，只需试验一下，然后查找HEX colour codes