![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Correction status：qualified
Teacher's comments：
Collection
Collection
一、学习php为什么要掌握html？
答：php是用来写后端框架的语言，html是前端标记语言，通过php后端的程序来控制前端的html，以失效我们所要的效果和功能。两者是互相关联起作用的，所以必须要掌握html，才能认识html语言所要表达的信息是什么。
二、为什么选择PHP开发动态网站？
答：1、php语言是目前最流行的框架开发语言；
2、用php语言开发项目要比用其他语言开发的效率会高很多；
3、php语言有完善的功能和框架。
三、表格作业代码
通过以下代码可以实现表格创建，表格边框设置，表格表头设置，表格行内属性设置，鼠标移入行内的效果设置，简单的按钮样式制作。
<!DOCTYPE html>
<html>
<head>
<title>8月14日作业</title>
<meta charset="utf-8">
</head>
<body>
<table>
<caption>采购清单</caption>
<tr>
<th>编号</th>
<th>产品名称</th>
<th>产品价格</th>
<th>采购数量</th>
<th>产品图片</th>
<th>立即shopping</th>
</tr>
<tr>
<td>1</td>
<td>笔记本电脑</td>
<td>4999元</td>
<td>5台</td>
<td><img src="image/bijiben.jpg" alt="笔记本电脑" style="width:150px;height:80px;"></td>
<td><a href="http://www.baidu.com">立即shopping</a></td>
</tr>
<tr>
<td>2</td>
<td>空调</td>
<td>2999元</td>
<td>10台</td>
<td><img src="image/kongtiao.jpg" alt="空调" style="width:150px;height:80px;"></td>
<td><a href="http://www.baidu.com">立即shopping</a></td>
</tr>
<tr>
<td>3</td>
<td>热水器</td>
<td>3000元</td>
<td>1台</td>
<td><img src="image/reshuiqi.jpg" alt="热水器" style="width:150px;height:80px;"></td>
<td><a href="http://www.baidu.com">立即shopping</a></td>
</tr>
<tr>
<td>4</td>
<td>办公桌</td>
<td>3200元</td>
<td>1台</td>
<td><img src="image/bangongzhuo.jpg" alt="办公桌" style="width:150px;height:80px;"></td>
<td><a href="http://www.baidu.com">立即shopping</a></td>
</tr>
<tr>
<td>5</td>
<td>电风扇</td>
<td>4999元</td>
<td>1台</td>
<td><img src="image/fengshan.jpg" alt="电风扇" style="width:150px;height:80px;"></td>
<td><a href="http://www.baidu.com">立即shopping</a></td>
</tr>
</table>
<style type="text/css">
table {text-align:center;border-collapse: collapse;width:900px;margin:20px auto;}
table caption {font-size: 30px;color:green;font-weight:bold;font-family:微软雅黑;margin-bottom:20px;}
table,th,td {border:1px solid #666;}
table tr:first-child {background-color: #ccc;font-size:25px;font-family:微软雅黑;line-height:50px;}
table tr:hover {background-color:#efefef; color:red;font-weight:bold;font-family:黑体;}
table tr td img {padding:5px;border-radius: 10px;}
table tr td a {text-decoration: none;width:200px;height:50px;padding:5px;border:1px solid red;background: white;color:red;border-radius: 8px;}
table tr td a:hover {background: red;color:white;}
</style>
</body>
</html>点击 "运行实例" 按钮查看在线实例
代码执行结果如下图
