php table布局,DIV和table页面布局的区别和联系

本文向大家描述一下DIV和Table页面布局的区别和联系,一般来说Table开发快,容易控制,浏览器兼容也好些,至于DIV的优势请看下文详解。

DIV和Table页面布局的区别和联系

现在对于网页制作是选择传统的Table还是用新型的DIV,有分歧。一部分说还是用Table好,开发快,容易控制,浏览器兼容也好些;另一部分认为DIV好,以后的发展趋势,主要是如下原因:

DIV+CSS布局比Table布局节省页面代码,代码结构也更清晰明了。

DIV+CSS开发速度要比Table快,而且布局更精确,不过手写代码明显增加DIV+CSS布局,使网站版面布局修改变的更简单。

DIV+CSS布局能够适应未来多种客户端需求。

DIV+CSS布局节约站点所占空间和站点流量。这些都是DIV的好处。

DIV有这么多好处是不是有些心动,决定学它。DIV和Table各有长处,通常情况下它们可以互换使用。

我感觉正确的符合标准的设计思路是:使用DIV等布局元素来制作页面的设计布局,定位,色块,图片等。使用Table,UL等这样的元素来显示页面中需要展示的数据。因为DIV不会像Table一样,在IE下要将整个Table下载完后才全部显示内容(firefox不会),所以用Table来布局显然是不合适的,尤其是数据量大时,在IE下用Table会发现慢的多。而DIV就好多了。当然,DIV也起整理数据的作用。

DIV用于布局,Table用于显示数据,这是现在最基本的设计原则。

1:Table里可以内嵌DIV。反之DIV可以内嵌Table吗??

当然可以了。

◆DIV定义

表示一块可显示HTML的区域。

SpecifiesacontainerthatrendersHTML.

注释

此元素在InternetExplorer3.0及以上版本的HTML中可用,在InternetExplorer4.0及以上版本的脚本中可用。

此元素是块元素。

此元素需要关闭标签。

TheDIVelementisavailableinHTMLasofInternetExplorer3.0,andinscriptasof InternetExplorer4.0. Thiselementisablockelement. Thiselementrequiresaclosingtag.

示例代码

下面的例子使用了两个DIV元素对两段文字进行了不同的对齐处理。

ThisexampleusestwoDIVelementstoaligntwosectionsoftextdifferently.

此文本代表一段。可以在这里放你的HTML或文本

DIV>

此文本代表另外一段,其中文本居中显示。

DIV>

DIV本身就是容器性质的,你不但可以内嵌Table还可以内嵌文本和其它的HTML代码。

2:DIV是不是跟Table一样的作用?

DIV的作用跟Table是差不多的,但是DIV对xml的支持更好而且使用起来比较灵活,因此被推荐为新的网页布局方式。

3:DIV Table哪个速度快?

DIV相对比较快,网页内容的显示需要将相对一整块的内容下载完成后再显示。使用DIV布局是许多的独立的相对较小的范围,而使用Table布局一般都会表格嵌套多层形成较大的下载范围。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
实现邮箱注册登录功能和页面美化需要以下步骤: 1. 创建数据库和用户表:同样需要使用 MySQL 数据库创建一个用户表,表中至少需要包含用户名和密码字段,同时还需要添加一个邮箱字段。 2. 创建注册页面:在注册页面中,用户需要输入用户名、密码和邮箱,系统需要验证用户名和邮箱是否已存在,如果不存在则将用户名、密码和邮箱插入到用户表中。 3. 创建登录页面:在登录页面中,用户需要输入邮箱和密码,系统需要查找用户表中是否存在该邮箱和对应的密码,如果存在则登录成功,否则登录失败。 4. 实现会话:在用户登录成功后,需要创建一个会话,保存用户信息,以便后续的操作中使用。 5. 实现页面布局美化:使用 HTML 和 CSS 对注册登录页面进行美化,提高用户体验。 下面是一个简单的 PHP 实现代码: 1. 创建数据库和用户表 ```sql CREATE DATABASE `mydb`; USE `mydb`; CREATE TABLE `user` ( `id` int(11) NOT NULL AUTO_INCREMENT, `username` varchar(50) NOT NULL, `password` varchar(50) NOT NULL, `email` varchar(50) NOT NULL, PRIMARY KEY (`id`), UNIQUE KEY `username` (`username`), UNIQUE KEY `email` (`email`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8; ``` 2. 创建注册页面 ```html <!DOCTYPE html> <html> <head> <title>用户注册</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="form"> <h1>用户注册</h1> <form action="register.php" method="post"> <div class="form-group"> <label>用户名:</label> <input type="text" name="username" required> </div> <div class="form-group"> <label>密码:</label> <input type="password" name="password" required> </div> <div class="form-group"> <label>邮箱:</label> <input type="email" name="email" required> </div> <div class="form-group"> <button type="submit">注册</button> </div> </form> </div> </body> </html> ``` ```php <?php if ($_SERVER['REQUEST_METHOD'] === 'POST') { $username = $_POST['username']; $password = $_POST['password']; $email = $_POST['email']; // 验证用户名和邮箱是否已存在 $pdo = new PDO('mysql:host=localhost;dbname=mydb;charset=utf8', 'root', 'password'); $stmt = $pdo->prepare('SELECT COUNT(*) FROM `user` WHERE `username` = ?'); $stmt->execute([$username]); if ($stmt->fetchColumn() > 0) { echo '用户名已存在'; exit; } $stmt = $pdo->prepare('SELECT COUNT(*) FROM `user` WHERE `email` = ?'); $stmt->execute([$email]); if ($stmt->fetchColumn() > 0) { echo '邮箱已存在'; exit; } // 插入用户记录 $stmt = $pdo->prepare('INSERT INTO `user` (`username`, `password`, `email`) VALUES (?, ?, ?)'); $stmt->execute([$username, md5($password), $email]); echo '注册成功'; } ?> ``` 3. 创建登录页面 ```html <!DOCTYPE html> <html> <head> <title>用户登录</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="form"> <h1>用户登录</h1> <form action="login.php" method="post"> <div class="form-group"> <label>邮箱:</label> <input type="email" name="email" required> </div> <div class="form-group"> <label>密码:</label> <input type="password" name="password" required> </div> <div class="form-group"> <button type="submit">登录</button> </div> </form> </div> </body> </html> ``` ```php <?php if ($_SERVER['REQUEST_METHOD'] === 'POST') { $email = $_POST['email']; $password = $_POST['password']; // 验证邮箱和密码 $pdo = new PDO('mysql:host=localhost;dbname=mydb;charset=utf8', 'root', 'password'); $stmt = $pdo->prepare('SELECT `username` FROM `user` WHERE `email` = ? AND `password` = ?'); $stmt->execute([$email, md5($password)]); $row = $stmt->fetch(PDO::FETCH_ASSOC); if ($row) { // 登录成功,创建会话 session_start(); $_SESSION['username'] = $row['username']; header('Location: index.php'); exit; } echo '邮箱或密码错误'; } ?> ``` 4. 实现会话 ```php <?php session_start(); if (!isset($_SESSION['username'])) { header('Location: login.php'); exit; } echo '欢迎登录,' . $_SESSION['username']; ?> ``` 5. 实现页面布局美化 ```css .form { width: 400px; margin: 0 auto; padding: 20px; } .form h1 { text-align: center; } .form-group { margin-bottom: 10px; } .form-group label { display: inline-block; width: 80px; text-align: right; margin-right: 10px; } .form-group input[type="text"], .form-group input[type="password"], .form-group input[type="email"] { width: 200px; padding: 5px; font-size: 16px; } .form-group button[type="submit"] { display: block; width: 100%; padding: 10px; background-color: #007bff; border: none; color: #fff; font-size: 16px; cursor: pointer; } .form-group button[type="submit"]:hover { background-color: #0069d9; } ``` 以上是一个简单的 PHP 实现,实际应用中还需要考虑安全性和用户体验等因素。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值