《跨平台的移动web开发实战(html5-css3)-源代码》由会员分享，可在线阅读，更多相关《跨平台的移动web开发实战(html5-css3)-源代码（203页珍藏版）》请在金锄头文库上搜索。
1、27单元1 跨平台的网站首页设计PART 1单元1跨平台的网站首页设计表1-1网页0101.html的HTML代码序号HTML代码01020304050607080910111213141516171819 酒店预订,机票预订查询,旅游度假-携程旅行网无线版官网 机票火车票续表序号HTML代码202122232425262728293031323334353637383940414243444546474849505152 用车 酒店 财富中心 攻略 旅游 门票 周末游 400 008 6666 下载客户端 我的携程 ENGLISH 电脑版 意见反馈 ©2014携程旅行 单击下方图标
2、，选择“添加至主屏幕” 表1-2网页0101.html主体结构的HTML代码序号HTML代码0102030405060708 表1-3网页0101.html通用CSS代码序号CSS代码序号CSS代码01020304050607080910111213141516html,body,nav,ul,li,h2 padding: 0px; margin: 0px;body min-width: 320px; font: normal 14px/1.5em Tahoma, Lucida Grande,Verdana, Microsoft Yahei,STXihei,hei ; color: #000;
3、 background: #e7f8ff; overflow-x: hidden;html,body height: 100%;17181920212223242526272829303132li list-style-type: none;img border: nonea color: #000; text-decoration: none;h2 a:link,h2 a:visited color: #fff;表1-4网页0101.html主体结构的CSS代码序号CSS代码序号CSS代码01020304050607080910111213141516171819header positio
4、n: relative; width: 100%; min-height: 50px; overflow: hidden; background: #e4f2fc.nav-list padding: 10px 10px 5px 10px;.nav-list:after content: 0020; display: block; clear: both; height: 0; overflow: hidden;20212223242526272829303132333435363738footer line-height: 27px; text-align: center; font-size
5、: 12px;.tool-box margin: 0 10px; padding-bottom: 5px;.c_pop_wrap position: fixed; left: 10px; right: 10px; z-index: 1000; bottom: 12px; /*display: none;*/表1-5网页0101.html顶部内容的CSS代码序号CSS代码序号CSS代码01020304050607. img-item height: 100%; overflow: hidden; float: left; margin: 10px 0px 0px; padding: 0px;08
6、091011121314.img-size width: 1280px; height: 110px;.item img width: 100%;表1-6网页0101.html中部内容的CSS代码序号CSS代码序号CSS代码01020304050607080910111213141516171819202122232425262728293031323334.nav-list li position: relative; float: left; margin-bottom: 5px; -webkit-box-sizing: border-box; -moz-box-sizing: borde
7、r-box; -ms-box-sizing: border-box; box-sizing: border-box;.nav-list li:before content: ; position: absolute; -webkit-transform: translate(-50%,0); -moz-transform: translate(-50%,0); -ms-transform: translate(-50%,0); transform: translate(-50%,0); background-image: url(./images/un_ico_home.png); background-size: 170px 160px; background-repeat: no-repeat;.nav-list h2 position: absolute; left: 8px; top: 8px; font:
