模仿apple中国大陆官方
我简单的模仿了一下,俗称贴图 ,技术还有待提升
html代码:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Apple(中国大陆)—官方网站</title><style>*{margin: 0;padding: 0;}.head{width: 100%;height: 50px;background:rgb(75, 72, 72);position: fixed;top: 0px;}#h{color: rgb(143, 138, 138);line-height: 50px;/* border: 1px solid black; */padding-left: 1400px;}.t{width: 100%;height: 50px;background-color: black;position: fixed;/* top: 50px; */}.t ul{width: 70%;height: 50px;/* background: red; */margin: 0 auto;list-style: none;}ul li{font-size: 2px;font-weight:200;line-height: 50px;float: left;padding: 0 20px;}a{color: rgb(128, 124, 124);text-decoration: none;}a:hover{color: white;}.app{padding-top:8px ;}.end{width: 100%;height: 50px;background-color: red;}#buy{font-size: 15px;line-height: 50px;}.end ul{list-style: none;padding-left: 100px;}#main{text-align:center;}#main1{text-align: center;}#s ul li{float: left;}#main2{text-align: center;}/* .dd{background-color: rgb(53, 40, 60);background: url(./img/ps6.png);} */</style>
</head>
<body><div class="head"><ul><li id="h"><广告></li></ul></div><div class="t"><ul><li class="app"><a href="https://www.apple.com.cn/"><img src="./img/ap.png" alt=""></a></li><li><a href="https://www.apple.com.cn/store">商店</a></li><li><a href="https://www.apple.com.cn/mac/">Mac</a></li><li><a href="https://www.apple.com.cn/ipad/">iPad</a></li><li><a href="https://www.apple.com.cn/iphone/">iPhone</a></li><li><a href="https://www.apple.com.cn/watch/">Watch</a></li><li><a href="https://www.apple.com.cn/airpods/">AirPos</a></li><li><a href="https://www.apple.com.cn/apple-home/">家居</a></li><li><a href="https://www.apple.com.cn/services/">Apple 独家</a></li><li><a href="https://www.apple.com.cn/shop/accessories/all">配件</a></li><li><a href="https://support.apple.com/zh-cn">技术支持</a></li><li class="app"><a href="#"><img src="./img/444.png" alt=""></a></li><li class="app"><a href="#"><img src="./img/555.png" alt=""></a></li></ul></div><div class="end"><ul><li id="buy">入手 AirPods Pro 虎年特别款*。 购买</li></ul></div><p id="main"><img src="./img/PS.png" alt=""></p><p id="main1"><img src="./img/ps1.png" alt=""></p><p id="main2"><img src="./img/ps2.png" alt="" width="1500px" height="725px"></p><!-- <div class="dd"></div> --><!-- <div><ul><li><a href="#"><img src="./img/ps3.png" alt="" width="800px" height="500px"></a></li><li><a href="#"><img src="./img/ps4.png" alt="" width="800px" height="500px"></a></li></ul></div> --><!-- <p><img src="./img/ps3.png" alt=""><img src="./img/ps4.png" alt=""></p> --><table><tr><td><img src="./img/ps3.png" alt="" width="750px" height="600px"></td><td><img src="./img/ps4.png" alt="" width="750px" height="600px"></td></tr><tr><td><img src="./img/ps5.png" alt="" width="750px" height="600px"></td><td><img src="./img/ps7.png" alt="" width="750px" height="600px"></td></tr><tr><td><img src="./img/ps8.png" alt="" width="750px" height="600px"></td><td><img src="./img/ps9.png" alt="" width="750px" height="600px"></td></tr></table><p><img src="./img/ps10.png" alt="" width="1500px" height="725px"></p>
</body>
</html>
上面的导航栏是精华,其他简单。
./img/PS.png
./img/ps1.png
./img/ps2.png
./img/ap.png
./img/444.png
./img/555.png
./img/ps3.png
./img/ps4.png
./img/ps5.png
./img/ps7.png
./img/ps8.png
./img/ps9.png
./img/ps10.png
模仿apple中国大陆官方相关推荐
- iphone x性能测试软件,iPhone - 电池性能测试信息 - Apple (中国大陆)
所有电池性能信息取决于蜂窝网络.地点.信号强度.功能设置.使用状况和许多其他因素,实际结果可能有所不同.电池充电周期的次数有限,最终可能需由 Apple 授权服务提供商更换.电池续航时间和充电周期次数 ...
- macos可以升级到指定版本吗_macOS - 如何升级 - Apple (中国大陆)
通用剪贴板 要求使用配备闪电或 USB-C 接口,并运行 iOS 10 或更新版本操作系统的 iPhone 或 iPad. 自动解锁 需要运行 watchOS 3 或更新版本操作系统的 Apple W ...
- OpenStack Days官方活动首登中国大陆,国内外云计算精英论道北京
70余位实力讲师,60场次研讨会,超过2000名与会者,共同分享OpenStack最新技术发展和行业应用实践 2016年7月14日- 北京- 久负盛名的OpenStack Days全球巡展中国站今日来 ...
- iPhone 6将于10月17日中国大陆发售 5288元起
iPhone 6和iPhone 6 Plus 苹果公司今天宣布,iPhone 6和iPhone 6 Plus将于10月17日在中国大陆发售,用户可通过Apple Store在线商店.Apple Sto ...
- 苹果搜索广告ASA已可在中国大陆地区App Store正式投放
北京时间7月21日凌晨1时,七麦AppSA测试发现,苹果搜索广告ASA后台已可以开始投放广告!且App Store中部分关键词的搜索结果顶部已经陆续出现有"广告"标识的产品展示. ...
- 一分钟解决“仅限中国大陆地区播放”
一分钟解决"仅限中国大陆地区播放" 来了这就没看上美剧了,主要是没有勇气看不带字幕的直播...难得这个周末有空,想起搜狐高清视频,结果"仅限中国大陆地区播放". ...
- 中国大陆物联网驶入快车道 台商抢上车
中国大陆谈「物联网」(IoT)已有好几年,今年官方终于确定相关技术标准.中国工信部于6月中公布关于<全面推进移动物联网(NB-IoT)建设发展的通知>,要求各省.自治区.直辖市及新疆生產建 ...
- 新西兰公民在中国大陆境内在线申请护照注意事项
1. 最好用 chrome .Firefox.edge 这些支持 HTML5 的浏览器(不用 IE): 2. 打开百度搜索"新西兰内政部",看到官方网站是:www.dia.govt ...
- 中国大陆开源(Linux)镜像站汇总
中国大陆开源镜像站汇总 1.企业贡献: 搜狐开源镜像站:http://mirrors.sohu.com/ 网易开源镜像站:http://mirrors.163.com/ 2.大学教学: 北京理工 ...
- 一分钟解决“仅限中国大陆地区播放” (转)
不要问LZ用没用过!LZ说了周末就是这么看搜狐高清的!不同的proxy,不同时段,不同地区,网速会有很大差别!LZ每次看都是搜最新的proxy!! 还有,尼玛用中国proxy开美国网页怎么可能不慢!! ...
最新文章
- java面试题2016_2016最新java面试题 详细版
- the virtual machine is configured for 64-bit guest operating systems
- js数组初始化——ES6 Array.prototype.fill()实践记录
- Redis持久化-数据丢失及解决
- linux用户权限简介,Linux用户及权限管理
- 机器学习笔记(十九)——最大熵原理和模型定义
- python 条形图 stack_python使用Plotly绘图工具绘制水平条形图
- html视图查看,视图.html · zhaohaihang/Semantic UI demo - Gitee.com
- 无刷直流电机驱动系统:组成结构及其控制原理
- 顶岗周记篇通用计算机,计算机实习周记20篇
- .less为后缀的文件是什么
- 进化算法——反向学习
- c语言生成excel文件简书,iOS 生成Excel xlsx文件
- 不懂这显然您不专业!云计算术语大全
- StreamNative 联合创始人翟佳出席QCon北京峰会并发表演讲
- 经典数学问题——三门问题(数据分析面试题)
- 计算机慢的解决方法,电脑很卡反应很慢该如何处理【解决方法】
- np.random.seed()函数
- 室内定位系统算法--无线时钟同步的比较
- Python:通过turtle 画樱花树