响应式及样式修改
parent
bde766fdd8
commit
c98b50f7fe
|
|
@ -182,7 +182,6 @@
|
|||
line-height: 30px;
|
||||
color: #fefefe;
|
||||
margin-bottom: 38px;
|
||||
text-align: justify;
|
||||
}
|
||||
.contentPage::-webkit-scrollbar {/*滚动条整体样式*/
|
||||
|
||||
|
|
@ -313,12 +312,12 @@ transition: all 1s;
|
|||
.Interview{
|
||||
flex: 1;
|
||||
margin-right: -300px;
|
||||
padding-left: 200px;
|
||||
padding-left: 250px;
|
||||
}
|
||||
|
||||
.InterviewCon{
|
||||
overflow: hidden;
|
||||
padding-left: 30px;
|
||||
overflow: hidden;
|
||||
padding-left: 30px;
|
||||
}
|
||||
.suspended{
|
||||
width: 100%;
|
||||
|
|
@ -427,6 +426,7 @@ transition: all 1s;
|
|||
margin-bottom: 16px;
|
||||
line-height: 24px;
|
||||
color: #e8e8e8;
|
||||
cursor: pointer;
|
||||
}
|
||||
.projectIntroductionList>div>.on{
|
||||
text-decoration: underline;
|
||||
|
|
@ -460,19 +460,29 @@ option{
|
|||
font-size: 20px;
|
||||
background-color: rgba(0,0,0,0);
|
||||
color: #bfbfbf;
|
||||
padding: 0 15px;box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #bfbfbf;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: auto;margin-top: 20px;
|
||||
margin: auto;
|
||||
margin-top: 20px;
|
||||
cursor: pointer;
|
||||
appearance:none; /*去掉下拉箭头*/
|
||||
background-image: url(../imgs/arrow.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 11px 7px;
|
||||
background-position: 74px center;
|
||||
}
|
||||
.projectIntroductionCon .select select{
|
||||
padding: 0 15px;
|
||||
font-size: 20px;
|
||||
background-color: rgba(0,0,0,0);
|
||||
color: #bfbfbf;
|
||||
border: none;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
cursor: pointer;
|
||||
appearance:none; /*去掉下拉箭头*/
|
||||
}
|
||||
.projectIntroductionJt>a{
|
||||
margin-right: 14px;
|
||||
|
|
@ -550,20 +560,26 @@ padding-right: 30px;
|
|||
font-size: 20px;
|
||||
background-color: rgba(0,0,0,0);
|
||||
color: #bfbfbf;
|
||||
padding: 0 15px;box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #bfbfbf;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: auto;
|
||||
margin-bottom: 43px;
|
||||
background-image: url(../imgs/arrow.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 11px 7px;
|
||||
background-position: 74px center;
|
||||
}
|
||||
.brand .select select{
|
||||
padding: 0 15px;
|
||||
font-size: 20px;
|
||||
background-color: rgba(0,0,0,0);
|
||||
color: #bfbfbf;
|
||||
border: none;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
appearance:none; /*去掉下拉箭头*/
|
||||
}
|
||||
.brand .title{
|
||||
margin-bottom: 22px;
|
||||
|
|
@ -784,6 +800,7 @@ height: 31px;
|
|||
color: #e8e8e8;
|
||||
display: inline-block;
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.indexBrandNav .list .on{
|
||||
background-color: #3b3a39;
|
||||
|
|
@ -996,6 +1013,9 @@ select{
|
|||
.siteImage .listImg{
|
||||
height: auto;
|
||||
}
|
||||
.nav{
|
||||
width: 230px;
|
||||
}
|
||||
.siteImage{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
|
|
@ -1007,7 +1027,7 @@ select{
|
|||
width: 200px;
|
||||
}
|
||||
.engineeringConText{
|
||||
width: 80%;
|
||||
width: 100%;
|
||||
}
|
||||
.engineeringConText .listImg{
|
||||
width: 80%;
|
||||
|
|
@ -1038,7 +1058,8 @@ select{
|
|||
margin-bottom: 10px;
|
||||
}
|
||||
.projectIntroductionCon{
|
||||
width: 70%;
|
||||
width: calc(100% - 250px);
|
||||
max-width: 950px;
|
||||
margin-left: 30px;
|
||||
}
|
||||
.mainCon{
|
||||
|
|
@ -1063,13 +1084,16 @@ select{
|
|||
width: 70%;
|
||||
margin: 0px;
|
||||
}
|
||||
.honoraryCertificate{
|
||||
width: calc(100% - 250px);
|
||||
margin-left: 250px;
|
||||
max-width: 954px;
|
||||
}
|
||||
.honoraryCertificateCon{
|
||||
width: calc(100% - 250px);
|
||||
max-width: 954px;
|
||||
margin-left: 250px;
|
||||
|
||||
}
|
||||
.honoraryCertificateCon>.list{
|
||||
width: 700px;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1079,6 +1103,9 @@ select{
|
|||
}
|
||||
}
|
||||
@media screen and (max-width:1020px){
|
||||
.nav{
|
||||
width: 250px;
|
||||
}
|
||||
.wellKnownProductsNav{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
|
@ -1132,6 +1159,9 @@ select{
|
|||
margin: auto;
|
||||
|
||||
}
|
||||
.honoraryCertificate{
|
||||
margin: 0;
|
||||
}
|
||||
.projectIntroductionNavButton{
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
|
|
@ -1312,10 +1342,35 @@ select{
|
|||
.projectIntroduction{
|
||||
display: block;
|
||||
}
|
||||
.contentPage{
|
||||
padding-right: 0;
|
||||
}
|
||||
.text{
|
||||
padding: 50px;
|
||||
height: auto;
|
||||
}
|
||||
.text img{
|
||||
max-width: 100%;
|
||||
margin: 10px auto;
|
||||
}
|
||||
.engineeringConText{
|
||||
height: auto;
|
||||
text-align: justify;
|
||||
}
|
||||
.contentPage .p{
|
||||
text-align: justify;
|
||||
}
|
||||
.aboutUsText{
|
||||
width: 100%;
|
||||
text-align: justify;
|
||||
}
|
||||
.projectIntroductionConMain img{
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width:768px){
|
||||
|
||||
.contactUsTel{
|
||||
display: block;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -58,7 +58,7 @@
|
|||
<div class="projectIntroductionList">
|
||||
<div class="projectIntroductionNav">
|
||||
<p>開元集團光霧合谷酒店 </p>
|
||||
<p class="on">釋玥森林度假酒店 </p>
|
||||
<p>釋玥森林度假酒店 </p>
|
||||
<p>樂山.清水荷花素食餐廳 </p>
|
||||
<p>巴中通江主題酒店 </p>
|
||||
<p>甘南州臨潭縣臨潭大酒店 </p>
|
||||
|
|
@ -73,7 +73,6 @@
|
|||
<p>寬窄巷子.天趣.紫園 </p>
|
||||
<div class="projectIntroductionNavButton">
|
||||
<img src="../imgs/zk.png" class="" alt="">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="projectIntroductionJt">
|
||||
|
|
@ -205,4 +204,11 @@
|
|||
</script>
|
||||
</body>
|
||||
<script src="../js/navBar.js"></script>
|
||||
<script>
|
||||
$(".projectIntroductionNav>p").eq(0).addClass("on")
|
||||
$(".projectIntroductionNav>p").on("click", function() {
|
||||
$(".projectIntroductionNav>p").removeClass("on")
|
||||
$(this).addClass("on")
|
||||
})
|
||||
</script>
|
||||
</html>
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 986 B |
Loading…
Reference in New Issue