Skip to content

J
jianchayuan
Commit ed46cba7 authored by liuqing's avatar liuqing
Browse files
Options

调整一下

parent 54adc6f6
Hide whitespace changes
Inline Side-by-side
Showing with 298 additions and 225 deletions
index_01.html
View file @ ed46cba7
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
.box_map.top::before{ .box_map.top::before{
content: ''; content: '';
position: absolute; position: absolute;
top: 1.5rem; top: 48%;
left: 53%; left: 53%;
height: 0.4rem; height: 0.4rem;
width: 0.5rem; width: 0.5rem;
......
plandirectory/areaPlan.html
View file @ ed46cba7
...@@ -107,39 +107,39 @@ ...@@ -107,39 +107,39 @@
<div class="area-box"> <div class="area-box">
<ul> <ul>
<li class="a_floor"> <li class="a_floor">
<a href="#"> <img src="../static/images/A_floor.png"/></a> <a href="/111"> <img src="../static/images/A_floor.png"/></a>
<span>A栋</span> <span>办公楼楼</span>
</li> </li>
<li class="bg1_floor"> <li class="bg1_floor">
<a href="/1"> <img src="../static/images/bgq_floor.png"/></a> <a href="/222"> <img src="../static/images/bgq_floor.png"/></a>
<span>办公楼</span> <span>办公楼楼</span>
</li> </li>
<li class="b_floor"> <li class="b_floor">
<a href="#"> <img src="../static/images/B_floor.png"/></a> <a href="#"> <img src="../static/images/B_floor.png"/></a>
<span>B栋</span> <span>办公楼楼</span>
</li> </li>
<li class="g_floor"> <li class="g_floor">
<a href="#"> <img src="../static/images/G_floor.png"/></a> <a href="#"> <img src="../static/images/G_floor.png"/></a>
<span>G栋</span> <span>办公楼楼</span>
</li> </li>
<li class="c_floor"> <li class="c_floor">
<a href="/3"> <img src="../static/images/C_floor.png"/></a> <a href="/3"> <img src="../static/images/C_floor.png"/></a>
<span>办公楼</span> <span>办</span>
</li> </li>
<li class="e_floor"> <li class="e_floor">
<a href="#"> <img src="../static/images/E_floor.png"/></a> <a href="#"> <img src="../static/images/E_floor.png"/></a>
<span>E栋</span> <span>办公楼楼</span>
</li> </li>
<li class="d_floor"> <li class="d_floor">
<a href="#"> <img src="../static/images/D_floor.png"/></a> <a href="#"> <img src="../static/images/D_floor.png"/></a>
</li> </li>
<li class="d_floor_index"> <li class="d_floor_index">
<a href="#"> <img src="../static/images/D_floor_1.png"/></a> <a href="#"> <img src="../static/images/D_floor_1.png"/></a>
<span>D栋</span> <span>办公楼楼</span>
</li> </li>
<li class="f_floor"> <li class="f_floor">
<a href="#"> <img src="../static/images/F_floor.png"/></a> <a href="#"> <img src="../static/images/F_floor.png"/></a>
<span>办公楼</span> <span>办公楼楼</span>
</li> </li>
<!-- <li class="h_floor"> <!-- <li class="h_floor">
<a href="#"> <img src="../static/images/F_floor.png"/></a> <a href="#"> <img src="../static/images/F_floor.png"/></a>
......
static/css/common.css
View file @ ed46cba7
body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div{margin:0;padding:0;border:0;font-size: 16px;color: #fff;} body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset, table, td, img, div {
ul,ol{list-style:none;} margin: 0;
select,input,img,select{vertical-align:middle;} padding: 0;
a{text-decoration:none;} border: 0;
font-size: 16px;
color: #fff;
}
ul, ol {
list-style: none;
}
select, input, img, select {
vertical-align: middle;
}
a {
text-decoration: none;
}
/*a:link{color:#009;} /*a:link{color:#009;}
a:visited{color:#800080;} a:visited{color:#800080;}
a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}*/ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}*/
.container .main-area{ .container .main-area {
background: url(../images/home_bj.png) no-repeat; background: url(../images/home_bj.png) no-repeat;
height: 100vh; height: 100vh;
background-size: cover; background-size: cover;
} }
body{
font-size: 100%; body {
font-size: 100%;
} }
/**棣栭〉**/ /**棣栭〉**/
.container{ .container {
height: 100vh; height: 100vh;
overflow: hidden; overflow: hidden;
min-width: 1200px; min-width: 1200px;
} }
.area-content .loupan_map_box { .area-content .loupan_map_box {
text-align: center; text-align: center;
} }
.loupan_map_box ul{
.loupan_map_box ul {
position: relative; position: relative;
} }
.loupan_map_box ul li{
.loupan_map_box ul li {
position: absolute; position: absolute;
} }
.loupan_map_box ul .index{
left: 11rem; .loupan_map_box ul .index {
top: 0.8rem; left: 11rem;
top: 0.8rem;
} }
.loupan_map_box ul .index_01{
left: 12.5rem; .loupan_map_box ul .index_01 {
top: 4.5rem; left: 12.5rem;
top: 4.5rem;
} }
.loupan_map_box ul .index_02{
left: 16.5rem; .loupan_map_box ul .index_02 {
top: 7rem; left: 16.5rem;
top: 7rem;
} }
.loupan_map_box ul .index_03{ .loupan_map_box ul .index_03 {
left: 7.8rem; left: 7.8rem;
top: 7rem; top: 7rem;
} }
.loupan_map_box ul .index_04{ .loupan_map_box ul .index_04 {
left: 11rem; left: 11rem;
top: 7.4rem; top: 7.4rem;
} }
.loupan_map_box ul .index_05{
left: 4rem; .loupan_map_box ul .index_05 {
top: 9rem; left: 4rem;
top: 9rem;
} }
.loupan_map_box ul .index_06{ .loupan_map_box ul .index_06 {
left: 6.8rem; left: 6.8rem;
top: 10rem; top: 10rem;
} }
.loupan_map_box ul .index_07{
left: 10rem; .loupan_map_box ul .index_07 {
left: 10.5rem;
top: 10rem; top: 10rem;
} }
.loupan_map_box ul .index_08{
.loupan_map_box ul .index_08 {
right: 12.5rem; right: 12.5rem;
top: 10.7rem; top: 10.7rem;
} }
.loupan_map_box ul .index_09{
.loupan_map_box ul .index_09 {
right: 9.5rem; right: 9.5rem;
top: 10rem; top: 10rem;
} }
.loupan_map_box ul .index_10{
.loupan_map_box ul .index_10 {
right: 7rem; right: 7rem;
top: 9rem; top: 9rem;
} }
.area-content .loupan_map_box{ .area-content .loupan_map_box {
background: url(../images/home_floor.png) no-repeat; background: url(../images/home_floor.png) no-repeat;
width: 34rem; width: 34rem;
height: 19rem; height: 19rem;
margin: 0 auto; margin: 0 auto;
margin-top: 2rem; margin-top: 2rem;
background-size: 100% 100%; background-size: 100% 100%;
} }
.header-area{ .header-area {
margin: auto; margin: auto;
text-align: center; text-align: center;
} }
.header-area img{
.header-area img {
width: 10rem; width: 10rem;
height: auto; height: auto;
padding-top: 1.4rem; padding-top: 1.4rem;
} }
/**鐩戞帶涓氬姟鏁版嵁**/
.area-content{ /**鐩戞帶涓氬姟鏁版嵁**/
margin:1rem 3rem 0 3rem; .area-content {
overflow: hidden; margin: 1rem 3rem 0 3rem;
overflow: hidden;
} }
.area-left{
.area-left {
width: 20%; width: 20%;
float: left; float: left;
} }
.area-content .area-left .title,.menu_title_box{ .area-content .area-left .title, .menu_title_box {
text-align: center; text-align: center;
} }
.area-content .area-left .title a,.menu_title_box a{
.area-content .area-left .title a, .menu_title_box a {
font-size: 0.6rem !important; font-size: 0.6rem !important;
color: #fff !important; color: #fff !important;
text-align: center; text-align: center;
...@@ -115,12 +148,14 @@ body{ ...@@ -115,12 +148,14 @@ body{
font-family: 'AlibabaPuHuiTi_2_85_Bold'; font-family: 'AlibabaPuHuiTi_2_85_Bold';
text-decoration: none; text-decoration: none;
} }
.left-menu { .left-menu {
margin-top: 20px; margin-top: 20px;
} }
.left-menu ul li{
background-color: #0d2a5b; .left-menu ul li {
border-radius: 7px; background-color: #0d2a5b;
border-radius: 7px;
margin-top: 0.6rem; margin-top: 0.6rem;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
...@@ -129,224 +164,261 @@ body{ ...@@ -129,224 +164,261 @@ body{
line-height: 1.5rem; line-height: 1.5rem;
padding: 0 20px; padding: 0 20px;
} }
.left-menu ul li span{
font-size: 0.5rem; .left-menu ul li span {
font-size: 0.5rem;
} }
.left-menu .menu-num span:nth-child(2){
.left-menu .menu-num span:nth-child(2) {
vertical-align: middle; vertical-align: middle;
padding:3px 20px; padding: 3px 20px;
border-radius: 13px; border-radius: 13px;
margin-left: 10px margin-left: 10px
} }
.area-right ul{
position: relative; .area-right ul {
position: relative;
} }
.area-right ul li{
position: absolute; .area-right ul li {
position: absolute;
} }
.area-right ul li span{
.area-right ul li span {
position: fixed; position: fixed;
font-size: 0.6rem; font-size: 0.5rem;
} }
.area-right ul .a_floor img{
width: 12.6rem; .area-right ul .a_floor {
} left: 9.2rem;
.area-right ul .a_floor{ top: 3.17rem;
left: 3.9rem; z-index: 99;
top: 3rem; }
}
.area-right ul .a_floor span{ .area-right ul .a_floor span {
left: 26rem; left: 25.7rem;
top: 7rem; top: 7.2rem;
} }
.area-right ul .bg1_floor img{
width: 16rem; .area-right ul .bg1_floor img {
} width: 16rem;
.area-right ul .bg1_floor{ }
left: 4rem;
top: 4.6rem; .area-right ul .bg1_floor {
} left: 4rem;
.area-right ul .bg1_floor span{ top: 4.6rem;
left: 30.7rem; z-index: 1;
top:8.4rem; }
}
.area-right ul .b_floor img{ .area-right ul .bg1_floor span {
width: 5rem; left: 30.6rem;
} top: 8.6rem;
.area-right ul .b_floor{ }
left: 4rem;
top: 7.8rem; .area-right ul .b_floor img {
} width: 5rem;
.area-right ul .b_floor span{ }
left: 20rem;
top: 13.6rem; .area-right ul .b_floor {
} left: 4rem;
.area-right ul .b_floor{ top: 7.8rem;
left: 4rem; }
top: 7.8rem;
} .area-right ul .b_floor span {
.area-right ul .g_floor img{ left: 20rem;
width: 7rem; top: 13.6rem;
} }
.area-right ul .g_floor{
left: 4rem; .area-right ul .b_floor {
top: 12.2rem; left: 4rem;
} top: 7.8rem;
.area-right ul .c_floor img{ }
.area-right ul .g_floor img {
width: 7rem;
}
.area-right ul .g_floor {
left: 4rem;
top: 12.2rem;
}
.area-right ul .c_floor img {
width: 4.4rem; width: 4.4rem;
} }
.area-right ul .c_floor { .area-right ul .c_floor {
left: 15.6rem; left: 15.6rem;
top: 6.3rem; top: 6.3rem;
z-index: 99;
} }
.area-right ul .c_floor span { .area-right ul .c_floor span {
left: 30.5rem; left: 30.6rem;
top: 11.7rem; top: 11.8rem;
}
.area-right ul .e_floor img {
width: 5.8rem;
}
.area-right ul .e_floor {
z-index: 2;
left: 15.6rem;
top: 13.4rem;
} }
.area-right ul .e_floor img{
width: 5.8rem; .area-right ul .d_floor img {
width: 3rem;
} }
.area-right ul .e_floor{
z-index: 2; .area-right ul .d_floor {
left: 15.6rem; right: 12rem;
top: 13.4rem; top: 6rem;
} }
.area-right ul .d_floor img{
width: 3rem; .area-right ul .f_floor img {
width: 5.8rem;
} }
.area-right ul .d_floor{
right: 12rem;
top: 6rem;
}
.area-right ul .f_floor img{ .area-right ul .f_floor {
width: 5.8rem; right: 1.7rem;
top: 11.7rem;
} }
.area-right ul .f_floor{
right: 1.7rem; .area-right ul .d_floor_index img {
top: 11.7rem; width: 5rem;
} }
.area-right ul .d_floor_index img{
width: 5rem; .area-right ul .d_floor_index {
right: 11rem;
z-index: 1;
top: 6.6rem;
} }
.area-right ul .d_floor_index{
right: 11rem;
z-index: 1;
top: 6.6rem;
}
/**涓氬姟灞?**/ /**涓氬姟灞?**/
.area-content .business{ .area-content .business {
background: url(../images/yewuceng.png) no-repeat; background: url(../images/yewuceng.png) no-repeat;
margin: 0 auto; margin: 0 auto;
margin-top: 2rem; margin-top: 2rem;
background-size: 100% 100%; background-size: 100% 100%;
} }
.bue-yewu .map img { .bue-yewu .map img {
transition: transform 0.3s ease-in-out; /* 娣诲姞杩囨浮鏁堟灉锛岃繃娓℃椂闂翠负0.3绉? */ transition: transform 0.3s ease-in-out; /* 娣诲姞杩囨浮鏁堟灉锛岃繃娓℃椂闂翠负0.3绉? */
} }
.bue-yewu .map img:hover { .bue-yewu .map img:hover {
transform: scale(1.05); /* 榧犳爣鎮仠鏃跺浘鏍囨斁澶т负鍘熸潵鐨?1.2鍊? */ transform: scale(1.05); /* 榧犳爣鎮仠鏃跺浘鏍囨斁澶т负鍘熸潵鐨?1.2鍊? */
} }
/**鐩戞帶涓氬姟鏁版嵁**/
.area-right ul .xzqy_floor{ /**鐩戞帶涓氬姟鏁版嵁**/
right: 5.2rem; .area-right ul .xzqy_floor {
top: 11rem; right: 5.2rem;
} top: 11rem;
/**鐩戞帶涓氬姟鏁版嵁**/ }
.area-right ul .jyl_floor{
right: 12rem; /**鐩戞帶涓氬姟鏁版嵁**/
top: 7rem; .area-right ul .jyl_floor {
} right: 11rem;
.area-right ul .cuican_floor{ top: 7.2rem;
right: 4.8rem; }
top: 8.3rem;
} .area-right ul .cuican_floor {
.area-right ul .litan_floor{ right: 4.8rem;
right: 5rem; top: 8.3rem;
top: 6.8rem; }
}
.area-right ul .wss_floor{ .area-right ul .litan_floor {
right: 6.8rem; right: 5rem;
top: 5.6rem; top: 6.8rem;
} }
.area-right ul .nanjian_floor{
right: 9rem; .area-right ul .wss_floor {
top: 4.3rem; right: 6.8rem;
} top: 5.6rem;
}
.area-right ul .beijian_floor{
right: 13rem; .area-right ul .nanjian_floor {
top: 3.6rem; right: 9rem;
} top: 4.3rem;
.area-right ul .nanchejian_floor{ }
right: 15rem;
top: 2.6rem; .area-right ul .beijian_floor {
z-index: 1; right: 13rem;
} top: 3.6rem;
.area-right ul .beijianyu_floor{ }
left: 16rem;
top: 6rem; .area-right ul .nanchejian_floor {
} right: 15rem;
.area-right ul .lhjl_floor{ top: 2.6rem;
right: 19rem; z-index: 1;
top: 12rem; }
}
.xkzx_floor{ .area-right ul .beijianyu_floor {
left: 15rem; left: 16rem;
top: 5rem; top: 6rem;
} }
.menu_box .tab_list ul,#videos{
.area-right ul .lhjl_floor {
right: 19rem;
top: 12rem;
}
.xkzx_floor {
left: 17rem;
top: 5rem;
}
.menu_box .tab_list ul, #videos {
padding-left: 0; padding-left: 0;
} }
.menu_box .tab_list ul li p { .menu_box .tab_list ul li p {
margin-bottom: 0 !important; margin-bottom: 0 !important;
} }
.modal{
.modal {
overflow: hidden !important; overflow: hidden !important;
} }
.area-right ul .a_floor span {
left: 25.7rem;
top: 7rem;
}
.area-right ul .b_floor span{ .area-right ul .b_floor span {
left: 19.6rem; left: 19.6rem;
top: 13.6rem; top: 13.7rem;
}
.area-right ul .c_floor span{
left: 30.7rem;
top: 11.7rem;
} }
.area-right ul .d_floor_index span { .area-right ul .d_floor_index span {
left: 35rem; left: 35rem;
top: 15.2rem; top: 15.3rem;
} }
.area-right ul .e_floor span { .area-right ul .e_floor span {
left: 32.2rem; left: 32.2rem;
top: 18.3rem; top: 18.4rem;
} }
.area-right ul .f_floor span { .area-right ul .f_floor span {
left: 44.3rem; left: 44.3rem;
top: 16rem; top: 16.2rem;
} }
.area-right ul .g_floor span { .area-right ul .g_floor span {
left: 21.2rem; left: 21.2rem;
top: 18.3rem; top: 18.4rem;
} }
.area-content .left-menu li a{
.area-content .left-menu li a {
display: flex; display: flex;
width: 100%; width: 100%;
justify-content: space-between; justify-content: space-between;
} }
.area-content .left-menu li:hover{
.area-content .left-menu li:hover {
cursor: pointer; cursor: pointer;
}
.a_floor img {
width: 6rem;
} }
\ No newline at end of file
static/images/A_floor.png
View replaced file @ 54adc6f6 View file @ ed46cba7
static/images/A_floor.png

186 KB | W: | H:

static/images/A_floor.png

113 KB | W: | H:

static/images/A_floor.png
static/images/A_floor.png
static/images/A_floor.png
static/images/A_floor.png
  • 2-up
  • Swipe
  • Onion skin
static/images/tubiao/A_floor.png
View replaced file @ 54adc6f6 View file @ ed46cba7
static/images/tubiao/A_floor.png

187 KB | W: | H:

static/images/tubiao/A_floor.png

113 KB | W: | H:

static/images/tubiao/A_floor.png
static/images/tubiao/A_floor.png
static/images/tubiao/A_floor.png
static/images/tubiao/A_floor.png
  • 2-up
  • Swipe
  • Onion skin
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment