帮我美化html网页,悬赏200
发布网友
发布时间：2022-05-09 14:26
共1个回答
热心网友
时间：2023-07-22 17:33
美化不容易，请采纳
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>商品资料查询</title>
<style type="text/css">
body {
font-family: "微软雅黑";
}
.tb {
border-width: 1px;
border-collapse: collapse;
border-color: gray;
border-style: solid;
}
td {
padding: 5px 10px 5px 10px;
border-width: 1px;
border-collapse: collapse;
border-color: #000079;
border-style: solid;
}
/*以下是美化的*/
tr:nth-child(1) td{
border-right: 1px solid white;
}
tr:nth-child(1) td:nth-child(5){
border-right: 1px solid #000079;
}
#tishi {
outline: none;
border: 1px solid gray;
padding: 5px;
font-family: "微软雅黑";
}
#search {
border: 1px solid #003D79;
padding: 5px 10px 5px 10px;
background: none;
color: #003D79;
font-family: "微软雅黑";
}
#search:hover {
background: #003D79;
color: white;
}
table {
border: 1px solid gray;
}
</style>
</head>
<body>
<div>
<!--搜索框-->
<form>
<input type="text" name="wb1" value="" id="tishi" placeholder="输入条码或名称" autofocus />
<input type="submit" value="搜索" id="search">
</form>
<table width=60% height="0" border="1" cellpadding="0" cellspacing="0" class="tb">
<tr bgcolor="#003D79" align="center">
<td>
<font color="#FFFFFF">
<B>条形码</B>
</font>
</td>
<td>
<font color="#FFFFFF">
<B>商品名称</B>
</font>
</td>
<td>
<font color="#FFFFFF">
<B>进货价</B>
</font>
</td>
<td>
<font color="#FFFFFF">
<B>销售价</B>
</font>
</td>
<td>
<font color="#FFFFFF">
<B>利润率</B>
</font>
</td>
</tr>
<tr>
<td> 测试1 </td>
<td>0001</td>
<td>0003</td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFACD">
<td> 无</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>无 </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
<ul>
<li><b>共找到3条相关记录。</b></li>
</ul>
</div>
</body>
</html>
