<!DOCTYPE html>

<html lang="zh-cn">

	<head>

		<title>我趣旅行网-美剧迷</title>

		<meta charset="utf-8">

		<meta name="viewport" content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

		<meta name="format-detection" content="telephone=no">

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

	</head>

	<body>

		<div class="wrapper">

			<img class="bg" src="img/background.png"/>

			<img class="logo" src="img/pisode_logo.png">

			<p class="pisode">Pisode</p>

		</div>

	</body>

</html>

css:

html,body{

	height:100%;

	margin:0;

	padding:0;

}

.wrapper{

	position:relative;

	margin: 0 auto;

	max-width: 500px;

	min-height: 100%;

	text-align: center;

	width: 100%;

}

.bg{

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	z-index: -1;

	height: 100%;

}

.logo{

	width:100%;

}

.pisode{

	font-size:14px;

}

效果图：

访问链接：http://2.chuang8.sinaapp.com

webapp设置适应pc和手机的页面宽高以及布局层叠图片文字的更多相关文章

  1. javascript 常用获取页面宽高信息 API

    在页面的构建中 常常会需要获取页面的一些宽高信息,例如实现 惰性加载图片 需要获取页面的可见区域高度 和 已滚动区域的高度,以判断图片所在位置是否可见来决定加载图片的时间, 花点时间整理了一下,获取页 ...

  2. jquery获取元素各种宽高及页面宽高总结

    window.onload=function(){ var a = $("#div").width(),//width()返回元素的宽高,不包括padding/border/mar ...

  3. jquery获取元素各种宽高及页面宽高

    如何使用jquery来获取网页里各种高度? 示例如下: $(document).ready(function(){  var divWidth = $("#div").width( ...

  4. js动态添加iframe，自适应页面宽高

    function showIframe(url,w,h){ //添加iframe var if_w = w; var if_h = h; $("<iframe width='" ...

  5. jQuery 获取页面宽高

    无滚动条的情况下(页面宽高比可视区域小):$(document)和$(window)的width.height方法获取的值都是一样的,都是可视区域的宽高即$(document).width()==$( ...

  6. 页面中iframe中嵌入一个跨域的页面，让这个页面按照嵌入的页面宽高大小显示的方式；iframe嵌套的页面不可以编辑的问题解决方案

    <html> <head> <style> body { margin-left: 0px; margin-top: 0px; margin-right: 0px; ...

  7. jq弹窗（获取页面宽高，滚轮高度，始终居中）

    jq写一个弹窗,效果如上图所示, 点击按钮弹窗弹出,右上角关闭. 弹窗始终显示在页面中间,无论放大缩小窗口,滚轮滚动. 代码如下: html: <br><br><br&g ...

  8. 屏幕的遮挡层，js得到屏幕宽高、页面宽高 (window.screen.availHeight)等--

    window.screen.availWidth 返回当前屏幕宽度(空白空间) ------当手机有输入法的时候,要注意................window.screen.availHeigh ...

  9. js得到屏幕宽高、页面宽高 (window.screen.availHeight)等--笔记

    window.screen.availWidth 返回当前屏幕宽度(空白空间) window.screen.availHeight 返回当前屏幕高度(空白空间) window.screen.width ...

随机推荐

  1. jQuery的Ajax请求数据时type无法使用GET

    写一个ASP.NET MVC例子,它是使用jQuery的$.Ajax来呼叫控制器的数据. 创建一个视图: 运行结果: 一切正常,但是本例子我们只是获取数据,并没有做任何数据POST上传至控制器,我们尝 ...

  2. ASP.NET Core实现OAuth2.0的AuthorizationCode模式

    前言 在上一篇中实现了resource owner password credentials和client credentials模式:http://www.cnblogs.com/skig/p/60 ...

  3. WPF学习之绘图和动画

    如今的软件市场,竞争已经进入白热化阶段,功能强.运算快.界面友好.Bug少.价格低都已经成为了必备条件.这还不算完,随着计算机的多媒体功能越来越强,软件的界面是否色彩亮丽.是否能通过动画.3D等效果是 ...

  4. 第三讲：WCF介绍（3）

    代码 https://yunpan.cn/cPns5DkGnRGNs   密码:3913   前面我们通过一个小的例子,大概了解的WCF. 这里我们补充下  EndPoint 配置  A,B,C  中 ...

  5. 基于TCP和多线程实现无线鼠标键盘-Socket(2)

    在(1)中,实现了Windows服务端与Android客户端的连接,本节将实现在Windows服务端与Android客户端之间传递数据. Android客户端的发送线程SendThread.java代 ...

  6. [转] 基于PHP Stream Wrapper开发有趣应用场景

    PHP Stream Wrapper 原文:http://blog.sina.com.cn/s/blog_502c8cc40100k40e.html ,主要是基于SAE环境讲述相应的应用场景,本文经过 ...

  7. RARP反向地址转换协议

    反向地址转换协议(RARP:Reverse Address Resolution Protocol) 反向地址转换协议(RARP)允许局域网的物理机器从网关服务器的 ARP 表或者缓存上请求其 IP ...

  8. 在spring中使用webservice（Restful风格）

    我们一般都会用webservice来做远程调用,大概有两种方式,其中一种方式rest风格的简单明了. 记录下来作为笔记: 开发服务端: 具体的语法就不讲什么了,这个网上太多了,而且只要看一下代码基本上 ...

  9. Scalaz（12）－ Monad：再述述flatMap，顺便了解MonadPlus

    在前面的几篇讨论里我们初步对FP有了些少了解:FP嘛,不就是F[A]吗?也是,FP就是在F[]壳子(context)内对程序的状态进行更改,也就是在F壳子(context)内施用一些函数.再直白一点就 ...

  10. append,appendTo和prepend #1daae2

    1.append(content)                                                                                   ...