获得徽章 0
- 项目清单表
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
*{margin: 0;padding: 0;}
h3{
height: 108px;line-height: 108px;
}
table{
margin:0 auto;
}
p{
width: 750px;margin: 0 auto;height: 30px;line-height: 30px;
}
</style>
</head>
<body>
<h3 align="center">
项目清单表</h3>
<table border="1" width="750" height="370" cellspacing="0">
<thead>
<tr height="30">
<th>序号</th>
<th>维修项目清单表</th>
<th>单价</th>
<th>数量</th>
<th>小计</th>
<th>工时</th>
<th>合计</th>
<th>维修原因</th>
</tr>
</thead>
<tbody>
<tr height="40px">
<th rowspan="4">7</th>
<td></td>
<td colspan="2" rowspan="4"></td>
<td rowspan="4"></td>
<td rowspan="4"></td>
<td rowspan="4"></td>
<td rowspan="4"></td>
</tr>
<tr height="40px">
<td></td>
</tr>
<tr height="40px">
<td></td>
</tr>
<tr height="40px">
<td></td>
展开赞过评论2 - 表格表单案例
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<form>
<table border="1"width="600"height="210"cellspacing="0">
<tr align="center">
<td width="134"rowspan="4">
总体信息
</td>
<td colspan="2">
用户信息
</td>
</tr>
<tr>
<td width="154" align="right">用户名:</td>
<td>
<input type="text" placeholder="填写用户名" />
</td>
</tr>
<tr>
<td align="right">密 码:</td>
<td>
<input type="password" />
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" />
<input type="reset" />
</td>
</tr>
</table>
</form>
</body>
</html>展开赞过评论1 - id选择器
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
#jd{
background: paleturquoise;
font-size: 60px;
}
h3,h4,h5,.qm{
width: 200px;
height: 200px;
background-color: yellow;
font-size: 40px;
}
</style>
</head>
<body>
<h1 id="jd">京东京东京东京东京东</h1>
<h1>天猫天猫天猫天猫天猫</h1>
<h1 class="qm">七猫七猫七猫七猫七猫</h1>
<h3>淘宝淘宝淘宝淘宝淘宝</h3>
<h4>百度百度百度百度百度</h4>
<h5>知乎知乎知乎知乎知乎</h5>
</body>
</html>展开等人赞过评论4 - 选择器
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
h1{
width: 300px;
height: 100px;
background: pink;
color: white;
}
.ha{
background-color: lightskyblue;
color: blueviolet;
}
</style>
</head>
<body>
<h1 class="ha">京东京东京东京东京东</h1>
<h1>天猫天猫天猫天猫天猫</h1>
<h1>七猫七猫七猫七猫七猫</h1>
<h1>淘宝淘宝淘宝淘宝淘宝</h1>
<h1 class="ha">百度百度百度百度百度</h1>
<h1>知乎知乎知乎知乎知乎</h1>
</body>
</html>展开赞过评论3 - 伪类选择器
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>伪类选择器</title>
<style>
a:link{font-size: 30px;color: blanchedalmond;}
a:visited{font-size: 15px;background: red;}
a:hover{font-size: 100px;color: cyan;}
a:active{color: yellow;background: paleturquoise;}
</style>
</head>
<body>
<a href=" ">新闻</a >
</body>
</html>展开赞过评论3 - 通配符选择器后代子代选择器
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
*{margin: 0;padding: 0;}
.fa>p{
background: blueviolet;
}
</style>
</head>
<body>
<p>这是一个p标签</p >
<p>这是一个p标签</p >
<p>这是一个p标签</p >
<div>这是一个div标签</div>
<h1>这是一个一级标签</h1>
<div class="fa">
这是最外层的div
<p>这是div里的p标签</p >
<div>
这是最里层的div
<p>这是最里层的p标签</p >
</div>
</div>
</body>
</html>展开赞过评论3 - id选择器
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#nav{
width: 100px;
height: 100px;
background-color: yellow;
}
</style>
</head>
<body>
<div id="nav">
<div>
<div class="content"></div>
</div>
</div>
</body>
</html>展开评论点赞 - CSS样式表特征
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
div{
width: 200px;
height: 200px;
background-color: pink !important;
}
</style>
<link rel="stylesheet" type="text/css" href="css/02.css"/>
</head>
<body>
<div style="background-color: green;">这是一个div</div>
</body>
</html>展开等人赞过76 - 内联样式
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div style="width: 200px;height: 200px;background-color: red;"></div>
</body>
</html>展开赞过评论1