1. 程式人生 > >html5圖片和放置在底部的實現

html5圖片和放置在底部的實現

<!doctype html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta http-equiv="X-UA-Compatible" content="chrome=1,IE=edge" />
	<title>Test</title>
<style>
		html {
			height:100%;
		}
		body {
			/*background-color:#FFFFFF;*/
			margin:0;
			/*height:100%;*/
			background: #FFFFFF url(${pageContext.request.contextPath }/resources/js/h5/bcg.png) no-repeat fixed center;
			background-position:center;
			background-size:100%;
		}
		#box span{
			display:table-cell;
			vertical-align:middle;
		}
	</style>
	<!-- copy these lines to your document head: -->

	<meta name="viewport" content="user-scalable=yes, width=device-width" />
</head>

<body>

<div id="box">
    <table width="100%" height="100%">
        <tr>
            <td align="center">
                <img src="${imgPath}" width="100" />
            </td>
        </tr>
        <tr height="0">
            <td align="center">
                <img src="${pageContext.request.contextPath }/resources/js/h5/startApp.png" width="100%" />
            </td>
        </tr>
    </table>
</div>
</body>
</html>