仿京东BOE官网 html代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./京东BOE.css">
<title>BOE官网-京东方官网</title>
</head>
<body>
<div class="box">
<div id="header">
<div class="center" id="hCenter">
<div class="hleft">
<div id="logo">
<a href="#"><img src="./images/logo.jpg"> </a>
</div>
<div class="hUl">
<ul>
<li id="chanping">
<a href="#">产品与服务</a>
</li>
<li id="chuanxing">
<a href="#">创新科技</a>
</li>
<li>
<a href="#">新闻中心</a>
</li>
<li>
<a href="#">BOE商城</a>
</li>
</ul>
</div>
</div>
<div id="hright">
<div class="hrTop">
<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="hrBottom">
<input type="text" placeholder="请输入关键词">
<button></button>
<a href="#">
English
</a>
</div>
</div>
</div>
</div>
<div id="column">
<ul id="cUl1">
<li id="cLi1" class="cli">
<ul>
<li class="cululi">
<a href="#">端口器件</a>
</li>
<li class="xianshi"><a href="#">显示与传感器件</a></li>
<li><a href="#" class="chuangan">传感器及解决方案</a></li>
</ul>
</li>
<li id="cLi2" class="cli">
<ul>
<li> <a href="#" class="cululi">智慧物联</a> </li>
<li><a href="#">loT解决方案</a></li>
<li><a href="#">智造服务</a></li>
<li> <a href="#">数字艺术</a></li>
</ul>
</li>
<li id="cLi3" class="cli">
<ul>
<li> <a href="#" class="cululi">智慧医工</a> </li>
<li> <a href="#" class="jiankang">移动健康</a></li>
<li> <a href="#" class="fuwu">健康服务</a></li>
</ul>
</li>
</ul>
</div>
<div id="column_in1" class="column_in">
<ul>
<li class="column_in_li"> <a href="#">TFT-LCD</a> </li>
<li class="column_in_li"><a href="#">AMOLED</a> </li>
<li class="column_in_li"><a href="#">微显示</a> </li>
<li class="column_in_li"><a href="#">传感器</a> </li>
</ul>
</div>
<div id="column_in2" class="column_in">
<ul>
<li class="column_in_li"><a href="#">医疗影像</a></li>
<li class="column_in_li"><a href="#">指纹识别</a></li>
<li class="column_in_li"><a href="#">生物监测</a></li>
<li class="column_in_li"><a href="#">智慧视窗</a></li>
</ul>
</div>
<div id="column_in3" class="column_in">
<ul>
<li class="column_in_li"><a href="#">产品解决方案</a></li>
</ul>
</div>
<div id="column_in4" class="column_in">
<ul>
<li class="column_in_li"><a href="#">数字医院</a></li>
<li class="column_in_li"><a href="#">数字人体</a></li>
<li class="column_in_li"><a href="#">再生医学</a></li>
<li class="column_in_li"><a href="#">解决方案</a></li>
</ul>
<div id="column2">
<ul id="cul1">
<li id="cLi1" class="cli">
<ul>
<li class="cululi cululi2">
<a href="#">BOE创新</a>
</li>
</ul>
</li>
<li id="cLi2" class="cli">
<ul>
<li class="cululi cululi2">
<a href="#">科技创新</a>
</li>
</ul>
</li>
<li id="cLi3" class="cli">
<ul>
<li class="cululi ">
<a href="#">创新平台</a>
</li>
<li>
<a href="#">协同创新平台</a>
</li>
<li>
<a href="#">创新空间</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
<div id="banner">
<ul id="img">
<li class="item active"><img src="./images/pic1.jpg" width="100%" height="450px"></li>
<li class="item"><img src="./images/pic2.jpg" width="100%" height="450px"></li>
<li class="item"><img src="./images/pic3.jpg" width="100%" height="450px"></li>
</ul>
<ul id="dot">
<li class="point active" data-index="0"></li>
<li class="point" data-index='1'></li>
<li class="point" data-index='2'></li>
</ul>
</div>
<div id="service">
<div class="sTitle">
<h3>产品与服务</h3>
</div>
<div class="sContent">
<div class=" sc" id="scLeft">
<a href="#"><img src="./images/img1.jpeg" width=350px; height=240px; alt="" id="yishang1">
<p>端口器件</p>
</a>
</div>
<div class=" sc" id="scCenter">
<a href="#"><img src="./images/img8.jpeg" width=350px; height=240px; alt="" id="yishang2">
<p>智能物联</p>
</a>
</div>
<div class=" sc" id="scRinght">
<a href="#"> <img src="./images/img3.jpeg" width=350px; height=240px; alt="" id="yishang3">
<p>智能医工</p>
</a>
</div>
</div>
</div>
<div id="content">
<div class="cTitle">
<h3><a href="#">创新科技</a></h3>
</div>
<div class="cContent">
<a href="#"><img src="./images/img6.jpeg" width="970px" height="340px" alt=""></a>
</div>
</div>
<div id="news">
<div class="nTitle">
<h3>热点新闻</h3>
</div>
<div class="nContent">
<div id="ncLeft" class="nc"><img src="./images/img8.jpg" width="100%" height="300px" alt="">
<P>BOE(京东方)智慧显示 BOE(京东方)智慧显示系统解决方案 惊艳亮相中华人民共和国成立70周年庆祝活动</P>
<a href="#">阅读全文></a>
</div>
<div id="ncCentent" class="nc"><img src="./images/img2.png" width="100%" height="300px" alt="">
<P>BOE(京东方)推百万级对比度BD Cell显示技术</P><a href="#">阅读全文></a>
</div>
<div id="ncRinght" class="nc"><img src="./images/img10.jpg" width="100%" height="300px" alt="">
<p>直击SID 2019:BOE(京东方)创新显示技术带你感受前沿科技魅力</p>
<a href="#">阅读全文></a></div>
</div>
<div id="wixin1" class="w">
<img src="./images/weixinCode.png" width="80px" height="80px" alt="">
</div>
<div id="wibo1" class="w">
<img src="./images/weiboCode.png" width="80px" height="80px" alt="">
</div>
<div id="in1" class="w">
<img src="./images/yleym.png" width="80px" height="80px" alt="">
</div>
</div>
<div id="winxin">
<div class="winxin_in">
<p>在社交媒体上关注我们 :</p>
<span>
<a href="#" id="weixin2"><img src="./images/weixin-icon02.png" alt="" id="winxin3"></a>
<a href="#" id="weibo2"><img src="./images/weibo-icon02.png" alt="" id="wibo3"></a>
<a href="#" id="in2"><img src="./images/yl2.png" alt="" id="in3"></a>
</span>
</div>
</div>
<div id="footer">
<div class="fContent">
<div class="row">
<div class="rLeft">
<ul class="ul1">
<li class="li1">
<ul class="ul2">
<li><a href="#">端口器件</a></li>
<li><a href="#">智慧物联</a></li>
<li><a href="#">智慧医工</a></li>
</ul>
</li>
<li class="li1">
<ul class="ul2">
<li><a href="#">BOE创新</a></li>
<li><a href="#">科技知乎</a></li>
<li><a href="#">协同创新平台</a></li>
<li><a href="#">创想空间</a></li>
</ul>
</li>
<li class="li1">
<ul class="ul2">
<li><a href="#" id="">关于BOE</a></li>
<li><a href="#">投资者关系</a></li>
<li><a href="#">企业社会责任</a></li>
</ul>
</li>
<li class="li1">
<ul class="ul2">
<li><a href="#">新闻中心</a></li>
<li><a href="#">BOE说</a></li>
</ul>
</li>
</ul>
</div>
<div class="rRinght">
<ul id="rrul">
<li class="rrli " id="a">
<img src="./images/qrcode2.png" width="100px" height="100px alt=" ">
<p>BOE画屏App</p>
</li>
<li class="rrli "><img src="./images/qrcode3.png " height="100px " width="100px " alt=" ">
<p>BOE移动健康App</p>
</li>
</ul>
</div>
</div>
<div class="bottom ">
<ul>
<li><p><a href="# ">网站地图</a> | <a href="# "> 隐私条款</a> | <a href="# ">除名查询</a> | <a href=" "> 快速链接</a></p></li>
<li class="b "><p><a href="# ">Copyright©2020京东方科技集团股份有限公司 版权所有</a></p></li>
<li><p>京ICP备12041691号-2.<a href="# ">京公网安备11010502026582</a><br>
<a href="# ">互联网药品信息服务资格证书 (京)-非经营性-2017-0039</a>
</p></li>
</ul>
</div>
</div>
</div>
<div class="aaa ">
<div class="a_1 aa ">
</div>
<div class="a_2 aa "></div>
<div class="a_3 aa "></div>
<div class="b_1 bb "></div>
</div>
</div>
<script src="jquery-3.5.1.js "></script>
<script type="text/javascript " src="./京东BOE.js "></script>
<script type="text/javascript " src="./京东BOE1.js "></script>
</body>
</html>
仿京东BOE官网 html代码的更多相关文章
- 仿京东BOE官网 jQuery代码
$(function() { $("#chanping").mouseenter(function() { $("#column").slideDown(500 ...
- 仿京东BOE官网 JavaScript代码
let items = document.getElementsByClassName('item'); let points = document.getElementsByClassName('p ...
- 仿京东BOE官网 css代码
* { margin: 0; padding: 0; border: 0; list-style: none; } .box { width: 1518px; height: 1300px; marg ...
- 仿京东BOE官网图片链接
- 基于jQuery仿迅雷影音官网幻灯片特效
分享一款基于jQuery仿迅雷影音官网幻灯片特效迅.雷影音官网jQuery幻灯片特效是一款带左右箭头,索引按钮切换的jQuery幻灯片代码.效果图如下: 在线预览 源码下载 实现的代码. html ...
- android 官网处理图片 代码
/** * 获取压缩后的图片 (官网大图片加载对应代码) * * @param res * @param resId * @param reqWidth * 所需图片压缩尺寸最小宽度 * @param ...
- 仿智能社官网:原生JS实现简单又酷炫的3D立方体时钟
先放一下我做的效果:https://linrunzheng.github.io/3Dclock/3Dclock/new.html 至于3D立方体怎么做这里就不在阐述了,可以看一下我之前的博客. 这里默 ...
- Bootstrap--模仿官网写一个页面
本文参考Bootstrap官方文档写了简单页面来熟悉Bootstrap的栅格系统.常用CSS样.Javascript插件和部分组件. 以下html代码可以直接复制本地运行: BootstrapPage ...
- 一款jQuery仿海尔官网全屏焦点图特效代码
一款jQuery仿海尔官网全屏焦点图特效代码,带有左右箭头的jQuery焦点图切换特效. 当焦点图切换时,下方的三块小图也相对应的进行切换.并且特效还兼容头疼的IE6.赶快去和谐了它吧! 适用浏览器: ...
随机推荐
- ✨Shell脚本实现Base64 加密解密
加密算法 # !/bin/bash # 全局变量 str="" base64_encode_string(){ # 源数据 source_string=$1 echo " ...
- ES数据库搜索
1.倒排索引 1.倒排索引和正向索引 在全文搜索里,文档数据离不开搜索,而搜索离不开索引(没有索引搜索会很低效),倒排索引(Inverted index)是全文搜索系统里最高效的索引方法和数据结构,E ...
- Oracle DataGuard故障转移(failover)后使用RMAN还原失败的主库
(一)DG故障转移后切换为备库的方法 在DG执行故障转移之后,主库与从库的关系就被破坏了.这个时候如果要恢复主从关系,可以使用下面的3种方法: 将失败的主库重新搭建为备库,该方法比较耗时: 使用数据库 ...
- PHP atan() 函数
实例 通过 atan() 函数返回不同数的反正切: <?phpecho(atan(0.50) . "<br>");echo(atan(-0.50) . " ...
- fpdf fpdi 操作pdf文件 写入中文汉字
今天给公司做一个线上合同签约功能,用户签约后 生成pdf版的文件 .网上搜了搜大概都是用fpdf进行操作的 , 通过fpdi 可以进行读取pdf模板. 在通过继承fpdf 操作现有的pdf文档 ...
- Skill 脚本演示 ycCommonCenterMos.skl
https://www.cnblogs.com/yeungchie/ ycCommonCenterMos.skl 自动生成一个共质心差分对 Mos ,可以自定布局类型. 回到目录
- P2569 [SCOI2010]股票交易 dp 单调队列优化
LINK:股票交易 题目确实不算难 但是坑点挺多 关于初值的处理问题我就wa了两次. 所以来谢罪. 由于在手中的邮票的数量存在限制 且每次买入卖出也有限制. 必然要多开一维来存每天的邮票数量. 那么容 ...
- react ts redux-saga | 谷歌Chrome浏览器风格的标签组件 | 中台
谷歌Chrome浏览器风格的标签组件 选用技术 react typescript redux-saga存储本地标签数据 umi 实现 [x] 支持全部关闭,当前关闭,关闭其他Tab [x] 支持Tab ...
- Spring异常总结
1. Caused by: org.springframework.beans.factory.NoSuchBeanDefinitionException: No qualifying bean o ...
- mybatis中的延迟查询思想
1.一对一延迟加载 延迟加载: 就是在需要用到数据时才进行加载,不需要用到数据时就不加载数据.延迟加载也称懒加载. 好处:先从单表查询,需要时再从关联表去关联查询,大大提高数据库性能,因为查询单表要比 ...