网页表单如何设计css美化

img


这个是怎么制作的,还有背景这些怎么弄上去的,不懂怎么使用css样式表

真是好老的样式设计。。。
其实这张图里值得说道的也就背景色的线性渐变和阴影偏移,写一个简单的页面给你参考一下

<!DOCTYPE html>
<html>
<head>
  <style>
    .table-container {
      position: relative;
      width: 400px;
      height: 200px;
      background: linear-gradient(to right top, #00b8e0, #ffffff 70%);
      box-shadow: -10px 10px 10px black;
      border-radius: 10px 10px;
      overflow: hidden;
      border: 1px solid #000000;
    }

    table {
      width: 100%;
      height: 100%;
      border-collapse: collapse;
    }

    th, td {
      padding: 10px;
      border: 1px solid #000000;
      text-align: center;
    }
  </style>
</head>
<body>
  <div class="table-container">
    <table>
      <tr>
        <th>Header 1</th>
        <th>Header 2</th>
        <th>Header 3</th>
      </tr>
      <tr>
        <td>Data 1</td>
        <td>Data 2</td>
        <td>Data 3</td>
      </tr>
      <tr>
        <td>Data 4</td>
        <td>Data 5</td>
        <td>Data 6</td>
      </tr>
    </table>
  </div>
</body>
</html>

实际效果差不多是这样的:

img

这是2000年代的设计风格,用frontpage就能做出来。
估计做这个的时候,你还没出生。这老师一个ppt就干一辈子了。