1.学习PHP为什么必须要掌握HTML?
答:
前端开发指的是静态页面的编写,主要涉及到html、css、JavaScript三个工具;
后端又称作服务器端,是运行在服务器环境中的,php就是后端编程语言其中的一种;因为php程序的运行后输出的结果就是html,所以不难看出,任何网站都是有网页组成的,也就是说想做一个网站,必须要学会做网页,html就是网页的基本标签,因必须要掌握html,今后才可以更方便的制作网站。
2.为什么选择PHP开发动态网站?
答:
php又叫做超文本预处理器,是一种开源的脚本语言,融合了c、java等其他的语言特点,学起来比较快,容易上手;php相对于其他的编程语言来说可以快速的执行动态网页,执行生成的html效率高。PHP具有非常强大的功能,支持几乎所有流行的数据库以及操作系统。更为重要的是PHP可以用C、C++进行程序的扩展!尤其是近几年的发展,促使应用领域广泛,版本迭代快;php框架比较规范,开发效率高。
代码:
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>表格实例操作</title> </head> <body> <table> <caption>手机参数对比</caption> <tr> <th>编号</th> <th>名称</th> <th>型号</th> <th>价格</th> <th>缩略图</th> <th>基本参数</th> <th>操作</th> </tr> <tr> <td>1</td> <td><h2>vivo</h2></td> <td>NEX旗舰版</td> <td><b>¥4498</b></td> <td><img src="https://2a.zol-img.com.cn/product/191_220x165/566/ceRo14zJK4flI.jpg" alt="" width="100"></td> <td> <ul> <li>核心数:八核</li> <li>内存:8GB</li> <li>主屏尺寸:6.59英寸</li> <li>电池容量:4000mAh</li> <li>后置摄像头:主摄2x1200万像素</li> <li>前置摄像头:800万像素</li> </ul> </td> <td><a href="">点击对比</a></td> </tr> <tr> <td>2</td> <td><h2>华为</h2></td> <td>Mate RS</td> <td><b>¥9999</b></td> <td><img src="https://2c.zol-img.com.cn/product/190_320x240/464/cek9voqaVYpeg.jpg" alt="" width="100"></td> <td> <ul> <li>核心数:八核</li> <li>内存:6GB</li> <li>主屏尺寸:6英寸</li> <li>电池容量:4000mAh</li> <li>后置摄像头:彩色4000万像素+黑白2000万像素</li> <li>前置摄像头:2400万像素</li> </ul> </td> <td><a href="">点击对比</a></td> </tr> <tr> <td>3</td> <td><h2>魅族</h2></td> <td>16 Plus</td> <td><b>¥3498</b></td> <td><img src="https://2c.zol-img.com.cn/product/192_220x165/334/ceRtdl8nJsFw.jpg" alt="" width="100"></td> <td> <ul> <li>核心数:八核</li> <li>内存:8GB</li> <li>主屏尺寸:6.5英寸</li> <li>电池容量:3640mAh</li> <li>后置摄像头:2000万像素+1200万像素</li> <li>前置摄像头:2000万像素</li> </ul> </td> <td><a href="">点击对比</a></td> </tr> <tr> <td>4</td> <td><h2>小米</h2></td> <td>MIX 2s</td> <td><b>¥3999</b></td> <td><img src="https://2f.zol-img.com.cn/product/190_220x165/101/ceiOd9tvonVNA.jpg" alt="" width="100"></td> <td> <ul> <li>核心数:八核</li> <li>内存:6GB</li> <li>主屏尺寸:5.99英寸</li> <li>电池容量:3400mAh</li> <li>后置摄像头:双1200万像素</li> <li>前置摄像头:500万像素</li> </ul> </td> <td><a href="">点击对比</a></td> </tr> </table> </body> </html> <style type="text/css"> table{width: 850px;text-align: center;margin: 20px auto;border-collapse: collapse;} table caption {font-size:3rem;font-weight:bold;color:#666;margin-bottom:20px;} table,th,td {border:1px solid #ccc;} table tr:first-child {background:lightgreen;} table tr:hover {background:#efefef;color:coral;} table tr:hover td:nth-of-type(2){color: blue;} table tr b{color: red;} table tr td:nth-of-type(6){text-align: left;} table tr td img {padding:5px;border-radius:10px;} table tr td a {text-decoration:none;width:100px;height:40px;line-height:40px;padding:5px;border:1px solid black;background-color:#fff;color:#000;border-radius:8px;} table tr td a:hover {background-color:#000;color:#fff;} ul li{list-style: none;font-size: 14px;color: #666;} </style>
运行实例 »
点击 "运行实例" 按钮查看在线实例
运行图片:
总结:
1、html文档什么都不写也可以,但不推荐,会自动生成<html><head></head><body></body></html>
2、双标签,如果没有正确关闭,浏览器会自动添加关闭标签
3、元素就是页面中要展现的内容,分为可见与不可见 <img><h1><p>,<br>
元素是用标签来表示的
4、标签是用来描述元素的工具
5、属性就是用来描述标签的
标签的四个公共属性:
style:内联样式,
id:标识唯一元素,
class:标识 同类元素,
title: 提示信息
6、双标签和单标签的区别
非可替换元素:就是直接写在html代码中的,然后由浏览器直接渲染出来<h2><p><li><a>
可替换元素:来自源码的外部,通过标签的属性引入:图片,文件,富(多)媒体,<img><link>