练习数据库和网页布局(查询好友列表)

学习:查询好友列表

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>练习数据库与网页布局</title>
<style>
*
{
	marger:0px auto;
	padding:0px;
}
.hy
{
	width:200px;
	height:50px;
	margin-top:5px;
}
/*   //使用下边的js之后,这些就不用了
.hy:hover
{
	background-color:#999;
	cursor:pointer;
}
*/
.pic
{
	width:50;
	height:50px;
	float:left;
}
.nk
{
	height:50px;
	width:130px;
	float:left;
	margin-left:20px;
	line-height:50px;
	vertical-align:middle;
}

</style>
</head>

<body>
<?php

$uid="18653378660";
?>

<?php
$db=new MySQLi("localhost","root","","mydb");
$sql="select friends from friends where uid=‘18653378660‘";
$result = $db->query($sql);
$attr=$result->fetch_all();
foreach($attr as $v)
{
	$fuid=$v[0];//好友的用户名

	//根据用户名查询users表的昵称和头像
	$sqlu="select nickname pic from users where uid=‘{$fuid}‘";
	$r=$db->query($sqlu);
	$attr=$r->fetch_row();

	echo "<div class=‘hy‘ onclick=‘select(this)‘>
	          <div class=‘pic‘><img width=‘50px‘ height=‘50px‘ src=‘{$attr[1]}‘/></div>
			  <div class=‘nk‘>{$attr[0]}</div>
	      </div>";
}
?>
</body>
<script type="text/javascript">
function select(aa)  //aa代表该div
{
	//清除原选中状态
	var div=document.getElementsByClassName("hy");
	for(var i=0;i<div.length;i++)
	{
		div[i].style.backgroundColor="white";
		div[i].style.color="#000000";
	}
	//设置选中
	aa.style.bachgroundcolor="#60c";
	aa.style.color="while";
}

</script>
</html>

  

时间: 05-05

练习数据库和网页布局(查询好友列表)的相关文章

UI进阶 即时通讯之XMPP好友列表、添加好友、获取会话内容、简单聊天

这篇博客的代码是直接在上篇博客的基础上增加的,先给出部分代码,最后会给出能实现简单功能的完整代码. UI进阶 即时通讯之XMPP登录.注册 1.好友列表 初始化好友花名册 1 #pragma mark - 管理好友 2 // 获取管理好友的单例对象 3 XMPPRosterCoreDataStorage *rosterStorage = [XMPPRosterCoreDataStorage sharedInstance]; 4 // 用管理好友的单例对象初始化Roster花名册 5 // 好友操

即时通讯之XMPP好友列表、添加好友、获取会话内容、简单聊天

1.好友列表 初始化好友花名册 1 #pragma mark - 管理好友 2 // 获取管理好友的单例对象 3 XMPPRosterCoreDataStorage *rosterStorage = [XMPPRosterCoreDataStorage sharedInstance]; 4 // 用管理好友的单例对象初始化Roster花名册 5 // 好友操作是耗时操作 6 self.xmppRoster = [[XMPPRoster alloc] initWithRosterStorage:r

简单实用的CSS网页布局中文排版技巧

由于汉字的特殊性,在css网页布局中,中文排版有别于英文排版.排版是一个麻烦的问题,小编认为,作为一个优秀的网页设计师和网页制作人员,掌握一些简单的中文排版技巧是不可或缺的,所以今天特意总结了几个简单实用的技巧,希望对大家有所帮助. 一.如何设定文字字体.颜色.大小等 font-style设定斜体,比如font-style:italic font-weight设定文字粗细,比如font-weight:bold font-size设定文字大小,比如font-size:12px line-heigh

一步一步来做WebQQ机器人-(四)(获取好友列表和群列表)

× 本篇主要是: 获取好友列表,群列表 我会尽量详细一点,尽我所知的分享一些可能大家已经掌握的或者还不清楚的经验 利于大家阅读,文章样式不再复杂化,根据内容取固定色 目前总进度大概65% 全系列预计会有这些步骤,当然某些步骤可能会合并: 验证码 第一次登陆 第二次登陆 保持在线和接收消息 获取好友和群列表 发送消息 变成智能的(*?∀?*) 获取好友 1-获取QQ好友的hash算法 P = function (b, j) { for (var a = j + "password error&qu

xmpp-iOS-获取好友列表、聊天信息列表、聊天

typedef enum {//发送消息类型的枚举 text, image, audio } MsgType; #import "XMPPData.h" #import "XMPPFramework.h" @interface XMPPData()<XMPPStreamDelegate,XMPPRosterDelegate,NSFetchedResultsControllerDelegate> @property(strong,nonatomic) XM

实现微信好友列表

 ListView列表控件 Android中的列表控件非常灵活,可以自定义每一个 列表项,实际上每一个列表项就是一个View,在Android定义 了3个列表控件:ListView.ExpandableListView和Spinner, 其中Spinner就是在Windows中常见的下拉列表框. 列表的显示需要三个元素: 1.View 用来展示数据的view 2.适配器 用来把数据映射到view上的中介. 3.数据  具体的将被映射的字符串,图片,或者基本组件. 实战案例 实现微信好友列表

网页布局基础

网页布局基础     简介 什么是网页布局?    网页布局是网页制作的基础,使用DIV+CSS布局网页是基础中的基础.三种基本布局方式:流式布局,浮动布局,绝对定位布局. 网页设计的特点:1:网页宽度可变  2头+内容主体(根据需要分栏)+页脚(不重要的内容)   对长度设置百分比可实现网页自适应 W3C标准包括结构化标准语言,表现标准语言,行为标准语言,倡导结构,样式,行为分离. CSS中,存在三种定位机制:标准文档流,浮动,绝对定位. 标准文档流:从上到下,从左到右输出文档内容,由块级元素

14.1 “1-2-1”变宽度网页布局

在上一章中,对固定宽度的页面布局傲了比较深入地分析和讲解.在本章中,将对变宽度的页面布局做进一步的分析.变宽度的布局要比固定宽度的布局复杂一些,根本的原因在于,宽度不确定,导致很多参数无法确定.因此.必须使用一些技巧来完成. 这里将介绍一些国外的CSS领域著名的设计师的研究成果,并对变宽度网页布局的总体情况进行归纳.希望读者能够保持清晰的思路,这样在实际工作中遇到具体的案例时,就可以灵活地选择解决方法.lodidance.com “1-1-1”布局过于简单,因此这里就不再介绍了.我们从“1-2-

iOS-QQ好友列表 iOS 页面间几种传值方式(属性,代理,block,单例,通知)

主要是 点击按钮实现下拉 刷新数据 页面间传值 // // HMFriendsModel.h // QQ好友列表 // // Created by YaguangZhu on 15/9/1. // Copyright (c) 2015年 YaguangZhu. All rights reserved. // #import <Foundation/Foundation.h> @interface HMFriendsModel : NSObject @property(nonatomic,cop