<style>
/* center icons */
.ui-grid-a { text-align: center; }
/* set row height */
.ui-block-a, .ui-block-b { height: 150px; position: relative; }
/* set label size and color */
.icon-label { color:#009966; display: block; font-size:12px; }
/* position the icons at the bottom of the block to adjust for uneven icon heights */
.icon-springboard { position: absolute; bottom: 0; width: 100%;}
a:link, a:visited, a:hover, a:active { text-decoration:none; }
</style>
<div data-role="content" data-theme="b">
<div class="ui-grid-a">
<div class="ui-block-a">
<div class="icon-springboard">
<a href="#" >
<img src="images/Live Mail.png" alt="Coming Soon" style="width:130px;height:130px;">
<span class="icon-label">收件箱</span>
</a>
</div>
</div>
<div class="ui-block-b">
<div class="icon-springboard">
<a href="#">
<img src="images/Email Chat.png" alt="Coming Soon" style="width:130px;height:130px;">
<span class="icon-label">已發郵件</span>
</a>
</div>
</div>
<div class="ui-block-a">
<div class="icon-springboard">
<a href="#" >
<img src="images/myspace_grn.png" alt="Coming Soon" style="width:130px;height:130px;">
<span class="icon-label">通訊錄</span>
</a>
</div>
</div>
<div class="ui-block-b">
<div class="icon-springboard">
<a href="#">
<img src="images/Google Drive Folder.png" alt="Coming Soon" style="width:130px;height:130px;">
<span class="icon-label">網絡硬盤</span>
</a>
</div>
</div>
<div class="ui-block-a">
<div style="position: absolute; bottom: 0; width:100%;">
<a href="#">
<img src="images/Gmai lalt.png" alt="Tickets" style="width:130px;height:130px;">
<span class="icon-label">寫郵件</span>
</a>
</div>
</div>
<div class="ui-block-b">
<div style="position: absolute; bottom: 0; width:100%;">
<a href="ch4/contact-us.html">
<img src="images/Gmail.png" alt="Contact Us" style="width:130px;height:130px;">
<span class="icon-label">我的郵件</span>
</a>
</div>
</div>
</div>
</div>