作业1:
学习php为什么要必需掌握html?
前端开发主要是指静态页面的编写,主要用到三个工具:HTML,CSS,javascript。后端也称服务器端,运行在服务器环境中,前端html代码,由浏览器负责解释并执行;后端代码,例如php,由服务器上的特殊程序来运行;php就是用来动态生成HTML代码的,为php程序的运行结果就是html,所有要学好html。
为什么选择php开发动态网站?
目前流行的动态网站开发语言除了php,还有Java、python、asp等,而php作为开发语言流行的重要原因是开发速度快,入门起步快,版本更新快,迭代快等优点。php也是动态开发语言中唯一可以将html融入编程代码中运行的开发语言。
作业2:
表格实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>表格</title> <style type="text/css"> table{ /*定义表格属性*/ width: 700px; /*定义表格整体宽度值;*/ text-align: center; /*定义表格内文本格式剧中显示*/ border-collapse: collapse; /*定义表格线合并为一条线*/ } table caption{ /*定义表格的标题的文本属性*/ font-weight: bold; /*定义字体为粗体*/ font-size: 2rem; /*定义字体大小值,1rem=10px*/ margin-bottom: 20px; /*定义元素的下外边距*/ color: #888; /*定义字体颜色*/ } table,th,td{ /*定义表格、表头、列的属性*/ border: 1px solid #999; /*定义边框属性,格式:border:border-width(边框宽度) border-style(边框样式) border-color(边框颜色),不设定其中某个值也不会出现错误。*/ height: 50px; /*定义高度值*/ } table thead{ /*定义表格内的表头的属性*/ background-color: lightgreen; /*定义背景颜色值*/ } table tr:hover{ /*定义表格内的行的属性*/ background-color: #efefef; /*定义背景颜色值*/ color: coral; /*定义表格内字体颜色值*/ } img{ /*定义图片属性*/ padding: 5px; /*定义图片边框粗细值*/ border-radius: 8px; /*定义图像边角圆滑度*/ width: 50px; /*定义图片宽度,定义其中一个值图片会按比例缩放*/ } td a{ /*定义单元格内的a标签属性值*/ text-decoration: none; /*定义取消a标签默认的下划线链接显示*/ width: 140px; /*定义标签宽度值*/ height: 30px; /*定义标签高度值*/ padding: 5px; /*定义边框线的粗细值*/ border: 1px solid black; /*同上*/ background-color: white; /*同上*/ border-radius: 5px; /*同上*/ color: black; /*同上*/ } td a:hover{ background-color: #777; color:#fff; } </style> <script type="text/javascript"> // 页内脚本设置元素 </script> </head> <body> <table> <caption>购物清单</caption> <thead> <tr> <td>编号</td> <td>名称</td> <td>类别</td> <td>制造商</td> <td>缩略图</td> <td>价格</td> <td>数量</td> <td>操作</td> </tr> </thead> <tbody> <tr> <td>001</td> <td>台式计算机</td> <td>办公设备</td> <td>联想</td> <td><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1534331022262&di=38d192ee2ac978a5207820a27631038a&imgtype=0&src=http%3A%2F%2Fpic.66zhuang.com%2Fzxrj%2Fpics%2Fimage%2F2015-03-04%2Feaa42d171c27ed0df624a787b2107437.jpg"></td> <td>5600</td> <td>10</td> <td><a href="http://php.cn">定购</a></td> </tr> <tr> <td>002</td> <td>便携式计算机</td> <td>办公设备</td> <td>联想</td> <td><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1534331852696&di=e9a3732674fcf8a753953404de337df5&imgtype=0&src=http%3A%2F%2Fpic15.photophoto.cn%2F20100617%2F0037037554403146_b.jpg"></td> <td>7700</td> <td>3</td> <td><a href="http://php.cn">定购</a></td> </tr> <tr> <td>003</td> <td>台式计算机</td> <td>办公设备</td> <td>惠普</td> <td><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1534331984993&di=68c2a35086059f0d38a59df4de60a597&imgtype=0&src=http%3A%2F%2Fimg.article.pchome.net%2F00%2F40%2F35%2F65%2F1.jpg"></td> <td>6600</td> <td>14</td> <td><a href="http://php.cn">定购</a></td> </tr> <tr> <td>004</td> <td>打印机</td> <td>办公设备</td> <td>联想</td> <td><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1534332034308&di=03c4843e3c4a35207de005c8431d5054&imgtype=0&src=http%3A%2F%2Fs10.sinaimg.cn%2Fmw690%2F003u8hxqgy6DP9lFXNn09%26690"></td> <td>799</td> <td>5</td> <td><a href="http://php.cn">定购</a></td> </tr> <tr> <td>005</td> <td>投影仪</td> <td>办公设备</td> <td>明基</td> <td><img src="https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=1313282296,4273023193&fm=27&gp=0.jpg"></td> <td>2430</td> <td>9</td> <td><a href="http://php.cn">定购</a></td> </tr> </tbody> </table> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例