作为一个穷人，唯一一次逛这么久的会员首页还是因为要写最头大的web~苦涩

效果图

源码

<!DOCTYPE html>

<html>

	<head>

		<meta charset="utf-8"/>

		<link rel="icon" href="qqIcon.jfif" type="image/x-icon"/>

		<title>QQ会员</title>

		<link rel="stylesheet" href="qqmember.css" type="text/css"/>

	</head>

	<body>

		<div id="all">

			<nav>

				<ul>

					<li>

						<image src="logo.png" height="100px width="100px"/>

					</li>

					<li class="words">

						<a href="#">功能特权</a>

					</li>

					<li class="words">

						<a href="#">游戏特权</a>

					</li>

					<li class="words">

						<a href="#">生活特权</a>

					</li>

					<li class="words">

						<a href="#">会员活动</a>

					</li>

					<li class="words">

						<a href="#">成长体系</a>

					</li>

					<li class="words">

						<a href="#">年费专区</a>

					</li>

					<li class="words">

						<a href="#">超级会员</a>

					</li>

				</ul>

			</nav>

			<div>

				<div>

					<a href="#" class="button" id="open">开通超级会员</a>

				</div>

				<div id="open">

					<a href="#" class="button" id="land">登录</a>

				</div>

			</div>

		</div>

	</body>

</html> 


body{

	margin:0;

	padding:0;

}

#all{

	width:100%;

	height:100px;

	background-color:rgba(0,0,0,0.15)

}

ul{

	list-style-type:none;

	margin:0;

	padding:0;

}

li{

	display:inline-block;

	float:left;

}

.words{

	margin-top:45px;

	margin-left:45px;

	width:100px;

}

.button{

	border:1px solid #000080;

	border-radius:15px;

	background-color:#BC8F8F;

	padding:10px;

	margin-top:30px;

	float:right;

	display:inline-block;

}

li a:hover{

	color:yellow;

}

li a:active{

	color:green;

}

a{

	text-decoration: none;

}

#open{

	margin-right:75px;

	background-color: #D2691E;

}

QQ会员首页HTML+CSS的更多相关文章

  1. 腾讯QQ会员技术团队：以手机QQ会员H5加速为例，为你揭开sonic技术内幕

    目前移动端越多越多的网页开始H5化,一方面可以减少安装包体积,另一方面也方便运营.但是相对于原生界面而言,H5的慢速问题一定被大家所诟病,针对这个问题,目前手Q存在几种方案,最常见的便是离线包方案,但 ...

  2. QQ空间首页背景图片淡出解析与不足完善

    一件事情的发生总是有原因的,当然更多的是对技术本身的追求,一定要搞懂啦,废话不多说,大宝剑直插主题. 起因 以前做过一个xx项目,在登陆界面背景图片中,直接引用了一张大图,css类似于这样(backg ...

  3. HTML5+CSS3 QQ会员页面导航

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  4. QQ会员AMS平台PHP7升级实践

    作者:徐汉彬链接:https://zhuanlan.zhihu.com/p/21493018来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. QQ会员活动运营平台(AMS ...

  5. 腾讯QQ会员技术团队：人人都可以做深度学习应用：入门篇（下）

    四.经典入门demo:识别手写数字(MNIST) 常规的编程入门有"Hello world"程序,而深度学习的入门程序则是MNIST,一个识别28*28像素的图片中的手写数字的程序 ...

  6. QUIC协议的分析，性能测试以及在QQ会员实践

    WeTest 导读 你听过HTTPS.HTTP2.0.SPDY,但是这些应用层协议都是基于可靠的传输层协议TCP来实现的.那么,基于高效的UDP协议有没有一种相对可靠的应用层协议呢? Why QUIC ...

  7. C#7.2——编写安全高效的C#代码 c# 中模拟一个模式匹配及匹配值抽取 走进 LINQ 的世界 移除Excel工作表密码保护小工具含C#源代码 腾讯QQ会员中心g_tk32算法【C#版】

    C#7.2——编写安全高效的C#代码 2018-11-07 18:59 by 沉睡的木木夕, 123 阅读, 0 评论, 收藏, 编辑 原文地址:https://docs.microsoft.com/ ...

  8. qq会员权益

    1.功能特权qq会员可以获得增加好友上限.QQ等级加速.创建2000人群.创建1000人群.表情漫游.云消息服务.离线传文件.网络相册.靓号抵用卷.文件中转站这10个方面的福利当然会员和超级会员在上面 ...

  9. 日请求亿级的 QQ 会员 AMS 平台 PHP7 升级实践

    QQ会员活动运营平台(AMS),是QQ会员增值运营业务的重要载体之一,承担海量活动运营的Web系统.AMS是一个主要采用PHP语言实现的活动运营平台, CGI日请求3亿左右,高峰期达到8亿.然而,在之 ...

  10. 升级到php7相关问题，日请求过亿QQ会员活动平台PHP7升级实践

    升级到php7相关问题,日请求过亿QQ会员活动平台PHP7升级实践 日请求过亿:QQ会员活动平台PHP7升级实践http://mp.weixin.qq.com/s?__biz=MjM5MjAwODM4 ...

随机推荐

  1. 设计原则&模式：单例模式（创建型）

    定义:某个类只能生成一个实例,该类提供了一个全局访问点供外部获取该实例,其拓展是有限多例模式. 五种实现方式: 饿汉式 懒汉式 双重校验 静态内部类 枚举类 饿汉式 特点:线程安全,调用效率高,但是不 ...

  2. 在ubuntu系统下，安装opencv各个版本

    要在Linux系统上安装OpenCV库,你可以通过包管理器(如apt)来安装.以下是详细的步骤,包括如何在/usr/local/lib或/usr/lib/x86_64-linux-gnu目录下安装Op ...

  3. Docker图形化工具Portainer安装

    Docker方式安装 我们可以直接使用 **Docker** 的方式来安装 首先创建数据卷,实现数据持久化 docker volume create portainer_db 启动 **Partain ...

  4. DEV插件--Spreadsheet1电子表格

    常用操作Spreadsheet常用属性标题栏是否可见 Spreadsheet1.TitleBar.Visible=true标题栏背景颜色 Spreadsheet1.TitleBar.Interior. ...

  5. Open diary（每天更新）

    .col-md-8 img { display: none } .comment img { display: unset } 这是一个open diary,就是公开日记. 为什么标题用英文呢?因为觉 ...

  6. 用正则表达式做爬取--java进阶day06

    1.String类中与正则有关的方法 replaceAll方法中要填入两个正则表达式,第一个是我们要修改的字符串,第二个则是我们要改成以后的字符串 如下图,出师表中存在很多数字,我们要删去这些数字,就 ...

  7. QwQ-32B：用强化学习打造的AI推理黑科技 🚀

    现在就体验 QwQ-32B:https://qwq32.com AI界的新星闪耀登场 小伙伴们,AI领域又出现重大突破啦!Qwen团队最新发布的QwQ-32B模型简直太厉害了!这个只有320亿参数的模 ...

  8. Pycharm两种快速激活方式（附最新激活码和插件）

    小张的Pycharm最近弹出提示框 Your license has expired提示过期....纳尼!!!! 是不是看到这个也很头疼,.于是我就在想有没有一种方式可以让他永久免费的,于是小张从网上 ...

  9. 成都信息工程大学天梯赛 L2-2 不要刁难我们了

    赛时板子没写对,原因就是标记数组的位置放错了,放到了while外面,导致这样距离数组是不会更新的,板子还是要自己多写少看 #include <bits/stdc++.h> #define ...

  10. public boolean add(E e)的源码分析

    public class ArrayList<E> extends AbstractList<E> implements List<E>, RandomAccess ...