<html>
<head>
<style scoped>
table {
border-collapse: collapse;
width: 100%;
margin-top: 20px;
border-radius: 10px;
overflow: hidden;
}
th {
background-color: #076aac;
color: #fff;
font-weight: bold;
padding: 8px;
text-align: left;
border: 1px solid #ffffff;
}
td {
background-color: #f8f8f8;
color: #333;
padding: 8px;
border: 1px solid #50a5f4;
}
.even-row {
background-color: #fff;
}
.odd-row {
background-color: #f2f2f2;
}
div {
padding: 20px;
}
h1 {
color: #ffffffbe;
text-align: center;
background: linear-gradient(200deg, #97b8ef, #07579c);
border-radius: 10px;
margin: 0 auto;
max-width: 50%;
padding: 10px;
margin-bottom: 20px;
}
</style>
</head>
<body>
<div id="app2">
<h1>学生信息管理</h1> <button @click="getstudents">获取</button>
<table >
<thead>
<tr>
<th>序号</th>
<th>姓名</th>
<th>学号</th>
<th>性别</th>
<th>年级</th>
<th>专业</th>
<th>住址</th>
<th>省份</th>
<th>电话</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<script>
</script>
</body>
</html>
<!--
[{stuid:1,stuname:"张张",stuphone:13555555555,stugender:"女",stugrade:2021,stumajor:"软件工程",stuaddess:"成都市新都区",stunative:"四川省",stuno:20213100000},
{stuid:1,stuname:"李李",stuphone:13888888888,stugender:"男",stugrade:2021,stumajor:"网络空间安全",stuaddess:"成都市新都区",stunative:"四川省",stuno:2021311111},
{stuid:1,stuname:"王王",stuphone:13777777777,stugender:"女",stugrade:2021,stumajor:"计算机科学与技术",stuaddess:"成都市新都区",stunative:"四川省",stuno:20213122222}] -->