html+css网页制作iphone首页1个页面大学生HTML5期末作业Web前端网页制作html网页制作htmlcss网页制作成品大学生html网页制作作业html5+css3+js

共27个文件

png：10个

jpg：10个

jpeg：4个

版权申诉

html

javascript

178 浏览量 2024-08-26 16:44:44 上传评论收藏 2.5MB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

iphone首页1个页面.zip （27个子文件）

iphone首页1个页面

.DS_Store 6KB

css

style.css 14KB

index.html 8KB

images

college.jpg 113KB

2.jpg 63KB

hero_ipadair_announce__dj1wuvavm26a_large_2x.jpeg 202KB

behind.jpg 90KB

3.png 146KB

new.jpg 27KB

1a334ebf-05c0-4c07-a12a-05d9b6db1842.jpeg 34KB

pic2.png 69KB

drgon.jpg 254KB

iphone8.jpg 58KB

pic.png 282KB

1.png 217KB

98f46ce0-ba68-4f6e-a5d0-434a2fac6cbd.jpeg 44KB

videoframe_2819.png 276KB

hero_ipadpro_announce__gi60pcfhpeie_medium_2x.jpeg 171KB

iphonex.png 46KB

ipad.png 46KB

c4ed1d7e-3303-4113-9e2d-3df90da3fa0e.png 24KB

iphonex1.png 89KB

macos.jpg 50KB

10001.png 140KB

3.jpg 87KB

7.jpg 18KB

macbook-pro.jpg 127KB

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1, maximum-scale=1 user-scalable=no" /> <title>Apple(中国)</title> <link rel="stylesheet" href="./css/style.css" /> </head> <body> <div id="page">   <nav>  <div class="nav-wrapper pc"> <ul> <li> <a href=""><i class="fa fa-apple fa-lg"></i></a> </li> <li><a href="">Mac</a></li> <li><a href="">iPad</a></li> <li><a href="#">iPhone</a></li> <li><a href="">Watch</a></li> <li><a href="">Music</a></li> <li><a href="">技术支持</a></li> <li> <a href=""><i class="fa fa-search"></i></a> </li> <li> <a href=""><i class="iconfont icon-bag"></i></a> </li> </ul> </div>  <div class="nav-wrapper phone"> <ul> <li> <a href="#"><i class="fa fa-bars" onClick="openme()"></i></a> <ul id="icon-list"> <li><i class="fa fa-close" onClick="closeme()"></i></li> <li><a href="#">Mac</a></li> <li><a href="#">iPad</a></li> <li><a href="#">iPhone</a></li> <li><a href="#">Watch</a></li> <li><a href="#">Music</a></li> <li><a href="#">技术支持</a></li> </ul> </li> <li> <a href="#"><i class="fa fa-apple"></i></a> </li> <li> <a href="#"><i class="fa fa-shopping-bag"></i></a> </li> </ul> </div> </nav>  <div class="container"> <div class="big-banner">  <div class="banner first"> <h1>iPad Pro</h1> <p>超薄，超强悍</p> <p class="c86868b">5月15日发售</p> <a class="a1" href="#">进一步了解</a> <a class="a2" href="#">立即订购</a> <div class="big-img"></div> </div>  <div class="banner second"> <h1 class="visuallyhidden">iPad Air</h1> <p>尺寸两款，芯片提速，事事成</p> <p class="c86868b">5月15日发售</p> <a class="a1" href="#">进一步了解</a> <a class="a2" href="#">立即订购</a> <div class="big-img"></div> </div>  <div class="small"> <ul> <li> <div class="one"> <h3>暑期特别呈献</h3> <p>钛金属，坚固轻盈，Pro 得真材实料</p> <a class="a1" href="#">进一步了解</a> <a class="a2" href="#">购买</a> </div> </li> <li> <div class="two"> <h3>iPhone 15</h3> <p>新主摄，新设计，开心超开心</p> <a class="a1" href="#">进一步了解</a><a class="a2" href="#">购买</a> </div> </li> <li> <div class="two three_1"> <h3>MacBook Air</h3> <p>轻装重拳 M3</p> <a class="a1" href="#">进一步了解</a> <a class="a2" href="#">购买</a> </div> </li> <li> <div class="two four_1"> <h3>WATCH</h3> <p>智能加成，加亮加实力</p> <a class="a1" href="#">进一步了解</a><a class="a2" href="#">购买</a> </div> </li> <li> <div class="one five_1"> <h3>Apple Trade In 换购计划</h3> <p> 折抵 iPhone 11 或后续机型，预计<br /> 可享 RMB 1000 至 RMB 5600 的换购优惠 </p> <a class="a1" href="#">获取折抵估价</a> </div> </li> <li> <div class="two six_1"> <h3>Apple 全球开发者大会</h3> <p>北京时间 6 月 11 日至 15 日线上见</p> <a class="a1" href="#">进一步了解</a> </div> </li> </ul> </div> </div>  <footer> <div class="footer-content"> <div class="footer-list"> <h3>选购及了解</h3> <ul> <li><a href="#">Mac</a></li> <li><a href="#">iPad</a></li> <li><a href="#">iPhone</a></li> <li><a href="#">Watch</a></li> <li><a href="#">Music</a></li> <li><a href="#">iTunes</a></li> <li><a href="#">iPod touch</a></li> <li><a href="#">配件</a></li> <li><a href="#">App Store 充值卡</a></li> </ul> </div> <div class="footer-list"> <h3>Apple Store 商店</h3> <ul> <li><a href="#">查找零售店</a></li> <li><a href="#">Genius Bar 天才吧</a></li> <li><a href="#">Today at Apple</a></li> <li><a href="#">Apple 夏令营</a></li> <li><a href="#">Field Trip 课外活动</a></li> <li><a href="#">Apple Store App</a></li> <li><a href="#">翻新和优惠</a></li> <li><a href="#">分期付款</a></li> <li><a href="#">Apple GiveBack 回馈计划</a></li> <li><a href="#">订单状态</a></li> <li><a href="#">选购帮助</a></li> </ul> </div> <div class="footer-list"> <h3>教育应用</h3> <ul> <li><a href="#">Apple 与教育 </a></li> <li><a href="#">高校师生选购</a></li> </ul> <br /> <br /> <h3>商务应用</h3> <ul> <li><a href="#">Apple 与商务</a></li> <li><a href="#">商务选购</a></li> </ul> </div> <div class="footer-list"> <h3>账户</h3> <ul> <li><a href="#">管理你的 Apple ID</a></li> <li><a href="#">Apple Store 账户</a></li> <li><a href="#">iCloud.com</a></li> </ul> <br /><br /> <h3>Apple 价值观</h3> <ul> <li><a href="#">辅助功能</a></li> <li><a href="#">环境责任</a></li> <li><a href="#">隐私</a></li> <li><a href="#">供应商责任</a></li> </ul> </div> <div class="footer-list"> <h3>关于 Apple</h3> <ul> <li><a href="#">Newsroom</a></li> <li><a href="#">Apple 管理层</a></li> <li><a href="#">工作机会</a></li> <li><a href="#">创造就业</a></li> <li><a href="#">活动</a></li> <li><a href="#">联系 Apple</a></li> </ul> </div> </div>  <div class="address"> <div class="tel">更多选购方式：前往<a href="#"> Apple Store 零售店</a>，致电 400-666-8800 或查找在你附近的<a href="#">授权经销商</a>。</div> <div

评论收藏

内容反馈

版权申诉