【php增删改查实例】第二十六节 - 个人详情页制作
在一般的系统中，当用户点击头像的时候，就会跳转到对应的个人详情页，在这个页面，他可以查看和修改自己的个人信息，或者更换头像。
本案例中，个人详情页使用bootstrap框架。
首先，我们新建一个html页面作为我的个人详情页。为了获取后台数据比较方便，这个详情页的文件格式我们就改为php。
在项目根目录新建一个user.php。
<html>
<head>
<meta charset="utf-8">
<title>个人详情页</title>
<script type="text/javascript"></script>
<style type="text/css">
</style>
</head>
<body>
个人详情页
</body>
</html>
然后，我们希望点击用户头像就跳转到这个详情页，怎么做呢？很简单，只要给img标签外面套一层a标签即可。
<a href="user.php" target="_blank"><img class='header_pic' width="64px" height="64px" src="imageUpload\<?php echo $header; ?>" /></a>
如果要用a标签打开一个新的页面，而不是当前页面直接跳转的话，就需要加上target="_blank" 属性。
测试成功。
个人详情页的绘制我们采用bootstrap框架。
抄一段百度百科：
Bootstrap，来自 Twitter，是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JavaScript 的，它简洁灵活，使得 Web 开发更加快捷。 [1] 它由Twitter的设计师Mark Otto和Jacob Thornton合作开发，是一个CSS/HTML框架。Bootstrap提供了优雅的HTML和CSS规范，它即是由动态CSS语言Less写成。Bootstrap一经推出后颇受欢迎，一直是GitHub上的热门开源项目，包括NASA的MSNBC（微软全国广播公司）的Breaking News都使用了该项目。 [2] 国内一些移动开发者较为熟悉的框架，如WeX5前端开源框架等，也是基于Bootstrap源码进行性能优化而来。
综上所述，反正bootstrap很牛逼，很流行，很好用就对了。
Bootstrap: http://www.bootcss.com/
下载下来后，得到的文件目录为：
将下载好的文件改一下名字，就叫bootstrap，拷贝到项目的根目录：
然后，打开user.php，引入核心的css文件和js文件。
<!-- 引入bootstrap的核心资源文件 -->
<link rel="stylesheet" type="text/css" href="bootstrap\css\bootstrap.min.css" />
<script type="text/javascript" src="jquery-easyui-1.3.3/jquery.min.js"></script>
<script type="text/javascript" src="bootstrap\js\bootstrap.min.js"></script>
根据需求，从https://v3.bootcss.com/css/
查看你想要的样式，然后复制粘贴到你的页面即可。
【php增删改查实例】第二十六节 - 个人详情页制作的更多相关文章
- 【php增删改查实例】第六节 - 部门管理模块（开始）
sql建表语句详见:https://www.jianshu.com/p/c88077ed9073 1.新建html模板 新建一个空白的txt文档,然后把后缀名改为.html 用任意一个编辑器打开,比如 ...
- 【php增删改查实例】第四节 -自己 DIY 一个数据库管理工具
本节介绍如何自己DIY一个数据库管理工具,可以在页面输入sql 进行简单的增删改查操作. 首先,找到xampp的安装目录,打开htdocs: 新建一个php文件,名称为 mysqladmin.php ...
- 【php增删改查实例】第十七节 - 用户登录（1）
新建一个login文件,里面存放的就是用户登录的模块. <html> <head> <meta charset="utf-8"> <sty ...
- 【php增删改查实例】第十一节 - 部门管理模块（编辑功能）
9. 编辑部门功能的实现 思路:只允许用户勾选一条数据,点击编辑按钮,会跳出一个和新增数据类似的对话框.然后,用户可以修改部门名称和部门编码.点击保存按钮,提示修改成功. 9.1 前台代码编写 < ...
- 【php增删改查实例】第五节 - easyUI的基本使用
1. 列表组件 datagrid 1.1 创建一个grid.html <html> <head> <meta charset="utf-8" /> ...
- 【php增删改查实例】第七节 - 部门管理模块（画一个datagrid表格）
在easyui中,datagrid组件需要用一个table标签去渲染. <table id="grid0" title="部门管理" class=&quo ...
- python链接oracle数据库以及数据库的增删改查实例
初次使用python链接oracle,所以想记录下我遇到的问题,便于向我这样初次尝试的朋友能够快速的配置好环境进入开发环节. 1.首先,python链接oracle数据库需要配置好环境. 我的相关环境 ...
- java：JSP（JSPWeb.xml的配置，动态和静态导入JSP文件，重定项和请求转发，使用JSP实现数据库的增删改查实例）
1.JSP的配置: <%@ page language="java" import="java.util.*" pageEncoding="UT ...
- yii2.0增删改查实例讲解
yii2.0增删改查实例讲解一.创建数据库文件. 创建表 CREATE TABLE `resource` ( `id` int(10) NOT NULL AUTO_INCREMENT, `textur ...
随机推荐
- Android项目实战（四十三）：夜神模拟器
一.下载模拟器到电脑 夜神模拟器 二.环境配置 计算机--系统--高级系统设置--环境变量 PATH 里面加入夜神模拟器的安装目录下的bin文件 三.启动模拟器 四.运行cmd命令,cd到夜神安装目录 ...
- mysql 获取一张表中， 另一张表不存在的数据
编写sql语句中,经常需要编写获取一张数据表中不存在与另一张表的数据,相关编写方法如下: 方法1: 使用not in ,效率低下,在数据较小的情况下可以采用如下编写 SELECT * FROM a A ...
- SQL中常用日期函数
--1 GETDATE() 返回当前系统日期SELECT GETDATE() --2 DATEADD(日期部分,常数,日期) 返回将日期的指定日期部分加常数后的结果返回 日期部分可以是: --常数为正 ...
- telnet 测试网站是否开启长连接
测试服务器是否开启keepalive(长连接) telnet 主机名(域名|IP) 80 #发起请求GET /index.html HTTP/1.1Host: www.cbnsc.com 如果请求完后 ...
- [20180928]如何能在11g下执行.txt
[20180928]如何能在11g下执行.txt --//链接问的问题: http://www.itpub.net/thread-2105467-1-1.html create table test( ...
- mssql sqlserver 视图如何加密，让第三方用户查看不到其中的SQL语句
转自:http://www.maomao365.com/?p=6719 摘要: 下文讲述视图加密的方法分享,通过此方法可以使视图只可使用,无法获取视图中sql脚本的内容,如下所示: 在创建视图的语法中 ...
- 洗礼灵魂，修炼python（67）--爬虫篇—cookielib之爬取需要账户登录验证的网站
学完前面的教程,相信你已经能爬取大部分的网站信息了,但是当你爬的网站多了,你应该会发现一个新问题,有的网站需要登录账户才能看到更多的信息对吧?那么这种网站怎么爬取呢?这些登录数据就是今天要说的——co ...
- 自动化测试基础篇--Selenium单选框（Radio）复选框（CheckBox）
摘自:https://www.cnblogs.com/sanzangTst/p/7686602.html 一.什么是单选框.复选框? 二.单选框:radio 三.复选框:checkbox 四.判断是否 ...
- Not Found woff 字体库
原因是,默认在IIS上是没有添加对*.woff,*.svg文件的Mime类型,因此在客户端请求此类文件时得到的都是404. 所以我们只需要在我们对应网站下的Mime类型中添加文件对应的类型就行了 .w ...
- Linux shell编写端口扫描脚本
Linux shell编写端口扫描脚本 需求: 扫描特定主机 扫描特定主机的特定端口 扫描特定网段 扫描特定网段中哪些主机开放了特定的端口 源码如下: #/bin/bash #该脚本用于对特定目标主机 ...