webfront / zhongyingwen · 提交

转到一个项目

作者 lihongjuan
提交 a25a08cca75f12cf06ddef0d56d3603e8a6a3a69 1 个父辈 9e5fa422

34343443

内嵌 并排对比
正在显示 12 个修改的文件 包含 424 行增加 和 42 行删除
... ... @@ -19,6 +19,8 @@
/*height:100%;*/
padding: 21px 32px;
box-sizing: border-box;
background: #fff;
}
img{
width:100%;
... ... @@ -174,12 +176,12 @@ img{
}
/***************************************/
.navbar-toggle{
background:#8EC63F ;
opacity: 0.4;
background:#EFC400 ;
opacity:1;
}
.navbar-inverse .navbar-toggle:hover {
background:#8EC63F ;
opacity: 0.4;
background:#EFC400 ;
opacity: 1;
}
.navbar-right{
width:85%;
... ... @@ -201,22 +203,22 @@ img{
position: relative;
}
.navbar-inverse .navbar-nav > li > a.navactive:before{
content:'';
display:block;
width:72px;
height:2px;
background: #2D70EF ;
position: absolute;
left:50%;
transform: translateX(-50%);
bottom:-20px;
}
/*.navbar-inverse .navbar-nav > li > a:hover{*/
/* color: #171717;*/
/* font-weight: bold;*/
/*.navbar-inverse .navbar-nav > li > a.navactive:before{*/
/* content:'';*/
/* display:block;*/
/* width:72px;*/
/* height:2px;*/
/* background: #2D70EF ;*/
/* position: absolute;*/
/* left:50%;*/
/* transform: translateX(-50%);*/
/* bottom:-20px;*/
/*}*/
.navbar-inverse .navbar-nav > li > a:hover{
color: #171717;
/*font-weight: bold;*/
}
.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
color: #fff;
background-color: transparent;
... ... @@ -298,20 +300,23 @@ img{
/*关于我们*/
.beyellow{
width:470px;
width:100%;
height:182px;
background: #EFC400;
position: relative;
margin-top:299px;
}
.guanyuwomenzi{
margin-left:12%
}
.beiimg{
width:473px;
width:100%;
height:314px;
font-size: 0;
position: absolute;
left:18px;
bottom:18px;
z-index:999
z-index:10
}
.guanyuourtop{
color:#3D444D;
... ... @@ -335,12 +340,12 @@ img{
position: absolute;
top:0;
left:0;
width:2px;
width:3px;
height:90px;
background:#2D70EF ;
}
.introtext{
width:573px;
width:100%;
height:130px;
color:#3D444D;
font-size: 16px;
... ... @@ -369,6 +374,12 @@ img{
.womencontainer{
background: #FFFFFF;
}
/*.navbar-nav{*/
/* display:table*/
/*}*/
/*.navbar-nav>li {*/
/* display:table-cell;*/
/*}*/
.kefutop{
width:40px;
height:40px;
... ... @@ -385,6 +396,7 @@ img{
position: fixed;
right:5%;
top:85%;
z-index:99
}
.ourproduct{
background:#F0F9FD;
... ... @@ -403,7 +415,7 @@ img{
font-size: 25px;
}
.protoppic{
width:376px;
width:100%;
height:376px;
font-size: 0;
}
... ... @@ -423,7 +435,7 @@ img{
text-overflow: ellipsis;
white-space: nowrap;
text-align: center;
margin:5px auto 0;
}
... ... @@ -434,3 +446,174 @@ img{
.pronum{
margin-top:54px;
}
.ouradvantage{
width:100%;
height:526px;
background: #fff;
position: relative;
}
.neiadvantage{
width:80%;
height:320px;
position: absolute;
left:50%;
transform: translateX(-50%);
bottom:-87px;
z-index:99
}
.uoushitop{
width:103px;
height:103px;
font-size: 0;
margin:0 auto;
}
.zhuanyename{
color:#3D444D;
font-size:16px;
font-weight: bold;
text-align: center;
}
.zhuantetext{
color:#5B5E63;
font-size: 12px;
line-height: 1.5;
}
.zhuanyetitlename{
color:#5B5E63;
font-size: 40px;
font-weight: bold;
text-align: center;
}
.zhuanyetitletext{
color:#5B5E63;
font-size: 25px;
text-align: center;
}
.zongzhi{
width:100%;
height: 604px;
background: url("../image/bagimg.png")no-repeat center;
background-size: 100% 100%;
position: relative;
}
.zongzhitop{
width:80%;
position: absolute;
top:35%;
left:50%;
transform: translateX(-50%);
}
.zongzhitext{
color:#F9F9F9;
font-size: 40px;
text-align: center;
}
.huanghengxian{
width:108px;
border:2px solid rgba(239,196,0,1);
opacity:1;
margin:24px auto 0;
}
.shuomingboxtop{
text-align: center;
color:#fff;
font-size: 12px;
margin-top:5px;
}
.shuomingbox{
margin-top:33px;
}
.connectlist{
/*overflow: hidden;*/
/*width:80%;*/
/*margin:64px auto 0;*/
margin-top:64px;
margin-bottom:120px;
}
.connectlistitem{
float:left;
}
.connectustop{
color:#5B5E63;
font-size: 40px;
font-weight: bold;
text-align: center;
margin-top:148px;
}
.connectusname{
color:#5B5E63;
font-size: 25px;
text-align: center;
}
.listitem{
margin-right:3%;
}
.connectlistitem:last-child{
margin-right:0
}
.connectitemimg{
width:70px;
height:70px;
font-size: 0;
margin:0 auto;
}
.footertop{
color:#fff;
}
.addressname{
margin-top:24px;
width:184px;
text-align: center;
}
/*底部*/
.footerbottom{
color:#8C9198;
text-align: center;
font-size: 12px;
width:90%;
margin:24px auto 0;
}
.footer{
border-top:8px solid #EFC400;
width:100%;
height:174px;
background: #343434;
}
.footertop{
list-style: none;
width:80%;
margin:63px auto 0;
display:flex;
justify-content: center;
align-items: center;
}
.footertop li{
color:#8C9198;
font-size: 12px;
padding:0 10px;
position: relative;
}
.gsjs:after{
display:block;
content:'';
width:1px;
height:14px;
background:#8C9198 ;
position: absolute;
top:0;
right:0
}
... ...
... ... @@ -2,6 +2,23 @@
.phonelist {
display:none
}
.toubu{
width:56px;
height:51px;
}
.beyellow{
width:95%
}
.zongzhi{
height:383px;
}
.zongzhitext{
font-size: 21px;
}
.zongzhitop{
top:15%
}
}
@media (min-width:768px) {
... ... @@ -11,7 +28,7 @@
}
.navbar-nav>li {
float: right
float: left
}
.navbar-nav>li>a {
... ... @@ -19,3 +36,29 @@
padding-bottom: 15px
}
}
@media (max-width:1020px){
.toubu{
width:56px;
height:51px;
}
.navbar-right{
width:91%;
}
.navbar-right li {
padding: 0 9px;
}
.neiadvantage{
position: relative;
top:0;
bottom:0
}
.ouradvantage{
height:705px;
}
}
@media (max-width:1200px){
.listitem{
margin-right:0
}
}
... ...
... ... @@ -9,13 +9,19 @@
<link rel="stylesheet" href="css/base.css">
<link rel="stylesheet" href="css/swiperfour.css">
<link rel="stylesheet" href="css/common.css">
<style>
#container{
width:75%;
height:379px;
margin:64px auto 0;
}
</style>
</head>
<body>
<!--头部导航-->
<nav id="common-nav" class="navbar navbar-inverse navbar-fixed-top">
<div class="container containerbox">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
... ... @@ -28,7 +34,6 @@
</div>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<div class="nav navbar-nav navbar-right phonelist">
<div class="phoneimg">
... ... @@ -49,20 +54,14 @@
<ul class="nav navbar-nav navbar-right navtou">
<li>
<a href="{:url('portal/invitePeople/viewOfPeople')}">
联系我们
</a>
<a href="" class="navactive">网站首页</a>
</li>
<li>
<a href="">
资料下载
</a>
</li>
<li>
<a href="">
主要服务
公司介绍
</a>
</li>
<li>
<a href="" >
... ... @@ -72,14 +71,26 @@
</li>
<li>
<a href="">
公司介绍
主要服务
</a>
</li>
<li>
<a href="">
资料下载
</a>
</li>
<li>
<a href="" class="navactive">网站首页</a>
<a href="">
联系我们
</a>
</li>
</ul>
</div><!-- /.navbar-collapse -->
... ... @@ -110,14 +121,14 @@
<div class="container">
<div class="row aboutwomen">
<div class="col-md-6 col-sm-12">
<div class="col-md-5 col-sm-12">
<div class="beyellow">
<div class="beiimg">
<img src="image/beijing.png" alt="">
</div>
</div>
</div>
<div class="col-md-6 col-sm-12">
<div class="col-md-5 col-sm-12 guanyuwomenzi">
<div class="guanyuour">
<div class="guanyuourtop">ABOUT US</div>
<div class="guanyuourbottom">关于我们</div>
... ... @@ -187,6 +198,137 @@
</div>
<!--我们的优势-->
<div class="ouradvantage">
<div class="neiadvantage">
<div class="container">
<div class="zhuanyetitle">
<div class="zhuanyetitlename">our advantages</div>
<div class="zhuanyetitletext">我们的优势</div>
</div>
<div class="row">
<div class="col-md-4 col-sm-12">
<div class="uoushitop">
<img src="image/tuandui.png" alt="">
</div>
<div class="zhuanyename">专业的维修团队</div>
<div class="zhuantetext">基值支义们京候么眼革下使叫。南石很样好清少去准连究志议构。
调研而手开求况做体式达高心置过。装切此报列明子马世志再部增心。</div>
</div>
<div class="col-md-4 col-sm-12">
<div class="uoushitop">
<img src="image/tuandui.png" alt="">
</div>
<div class="zhuanyename">专业的维修团队</div>
<div class="zhuantetext">基值支义们京候么眼革下使叫。南石很样好清少去准连究志议构。
调研而手开求况做体式达高心置过。装切此报列明子马世志再部增心。</div>
</div>
<div class="col-md-4 col-sm-12">
<div class="uoushitop">
<img src="image/tuandui.png" alt="">
</div>
<div class="zhuanyename">专业的维修团队</div>
<div class="zhuantetext">基值支义们京候么眼革下使叫。南石很样好清少去准连究志议构。
调研而手开求况做体式达高心置过。装切此报列明子马世志再部增心。</div>
</div>
</div>
</div>
</div>
</div>
<!--我们的宗旨-->
<div class="zongzhi">
<div class="zongzhitop">
<div class="zongzhitext">
本公司本着“诚信服务、合理价格”的宗旨
为新老客户提供优质服务
</div>
<div class="huanghengxian"></div>
<div class="shuomingbox">
<div class="shuomingboxtop">公司拥有专业的维修团队，经验丰富。</div>
<div class="shuomingboxtop">从技术咨询、到现场故障诊断，都可以提供专业服务，维修周期短、修复质量高、及时解决问题。</div>
<div class="shuomingboxtop">本公司备有大量现货，价格优惠，交货快捷， 质量可靠。</div>
<div class="shuomingboxtop">为企业节省了大量的资金，缩短了停产周期，提高了工作效率，在用户中树立了良好的口碑。</div>
</div>
</div>
</div>
<!--联系我们-->
<div class="connectus">
<div class="connectopbox">
<div class="connectustop">contact us</div>
<div class="connectusname">联系我们</div>
</div>
<div class="connectmap">
<div id="container" ></div>
</div>
<div class="connectlist">
<div class="container">
<div class="row">
<div class="col-md-2 listitem">
<div class="connectlistitem">
<div class="connectitemimg">
<img src="image/address.png" alt="">
</div>
<div class="addressname">天津市西青区华科大街1号</div>
</div>
</div>
<div class="col-md-2 listitem">
<div class="connectlistitem">
<div class="connectitemimg">
<img src="image/dianhua.png" alt="">
</div>
<div class="addressname">18888888888</div>
</div>
</div>
<div class="col-md-2 listitem">
<div class="connectlistitem">
<div class="connectitemimg">
<img src="image/pingban.png" alt="">
</div>
<div class="addressname">15688888888</div>
</div>
</div>
<div class="col-md-2 listitem">
<div class="connectlistitem">
<div class="connectitemimg">
<img src="image/weixin.png" alt="">
</div>
<div class="addressname">15688888888</div>
</div>
</div>
<div class="cil-md-2 listitem">
<div class="connectlistitem">
<div class="connectitemimg">
<img src="image/xinxi.png" alt="">
</div>
<div class="addressname">88888888@163.com</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--底部信息-->
<div class="footer">
<ul class="footertop">
<li class="gsjs">公司介绍</li>
<li class="gsjs">产品系列</li>
<li class="gsjs">主要服务</li>
<li >联系我们</li>
</ul>
<div class="footerbottom">小黄人智能科技有限公司主营：高速电机、同步伺服电机、大功率伺服电机、异步伺服电机等，质量可靠，价格公道，欢迎选购。沪公网安备 31011202006407号</div>
</div>
<!--客服-->
<div class="kefubox">
<div class="kefutop">
... ... @@ -203,6 +345,7 @@
<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/swiperfour.min.js"></script>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.2&key=735d888fa7a9599eea4de210edc32335"></script>
<script>
... ... @@ -226,6 +369,19 @@
$(this).parents("li").siblings("li").children("a").removeClass("navactive")
})
var map = new AMap.Map('container', {
resizeEnable: true,
center:[116.480983, 39.989628],
zoom:11
});
AMap.plugin('AMap.ToolBar',function(){
var toolbar = new AMap.ToolBar();
map.addControl(toolbar)
})
</script>
</html>
... ...