Authored by 鲁尚清

【无】公司网站-样式修改,移动端 #1

@@ -2290,7 +2290,7 @@ blockquote:before { @@ -2290,7 +2290,7 @@ blockquote:before {
2290 height: 100%; 2290 height: 100%;
2291 } 2291 }
2292 .tab-item-li{ 2292 .tab-item-li{
2293 - margin-right:80px; 2293 + margin-right:55px;
2294 } 2294 }
2295 @media (min-width: 992px){ 2295 @media (min-width: 992px){
2296 .intro-tab-container{ 2296 .intro-tab-container{
@@ -2372,6 +2372,9 @@ blockquote:before { @@ -2372,6 +2372,9 @@ blockquote:before {
2372 .container { 2372 .container {
2373 max-width: 1380px; 2373 max-width: 1380px;
2374 } 2374 }
  2375 + .tab-item-li{
  2376 + margin-right:80px;
  2377 + }
2375 } 2378 }
2376 .title-style-top{ 2379 .title-style-top{
2377 font-size: 42px; 2380 font-size: 42px;
@@ -3604,8 +3607,79 @@ blockquote:before { @@ -3604,8 +3607,79 @@ blockquote:before {
3604 .hzlc-sm{ 3607 .hzlc-sm{
3605 display: none; 3608 display: none;
3606 } 3609 }
  3610 +@media only screen and (max-width: 1400px){
  3611 + .intro-tab-scroll{
  3612 + transform: translateY(75px);
  3613 + }
  3614 +}
  3615 +@media only screen and (max-width: 1200px){
  3616 + .Aview .tab-item-li {
  3617 + margin-right: 40px;
  3618 + }
  3619 +
  3620 + .dataAbility-con{
  3621 + margin-top:60px;
  3622 + flex-flow: column;
  3623 + max-height: inherit;
  3624 + flex:none;
  3625 + }
  3626 + .dataAbility-bg{
  3627 + /*background-image: url("../img/serviceSecond/Aview/ability-bg-sm.png");*/
  3628 + background-image: none;
  3629 + }
  3630 + .dataAbility-bg-logo{
  3631 + display: none;
  3632 + }
  3633 + .dataAbility-col{
  3634 + max-width: 100%;
  3635 + }
  3636 + .dataAbility-col:nth-child(3) .dataAbility-item .dataAbility-item-intro-item:first-child{
  3637 + max-width: 100%;
  3638 + }
  3639 + .dataAbility-col:nth-child(2n) .dataAbility-item{
  3640 + margin-left:0;
  3641 + }
  3642 + .dataAbility-item{
  3643 + padding: 15px;
  3644 + background: #1E9FFF;
  3645 + margin: 8px 0;
  3646 + border-radius: 3px;
  3647 + }
  3648 + .dataAbility-item-intro-item{
  3649 + min-height: auto;
  3650 + }
  3651 + .dataAbility-item-intro{
  3652 + padding-top:10px;
  3653 + }
  3654 + .info-characterP .info-characterP-bg{
  3655 + background-image:none;
  3656 + background-color:#ffffff;
  3657 + border-radius: 3px;
  3658 + }
  3659 + .info-characterP:hover .info-characterP-bg{
  3660 + background-image:none;
  3661 + background-color:#1E9FFF;
  3662 + border-radius: 3px;
  3663 + }
  3664 + .tab-item-li{
  3665 + margin-right:25px;
  3666 + }
  3667 + .func-bg img{
  3668 + height: 100%;
  3669 + }
  3670 + .func-bottom-con-right{
  3671 + height: 20px;
  3672 + }
  3673 +
  3674 +}
3607 /*992以下的一些样式*/ 3675 /*992以下的一些样式*/
3608 @media only screen and (max-width: 991px){ 3676 @media only screen and (max-width: 991px){
  3677 + .dataAbility-con{
  3678 + margin-top:20px;
  3679 + }
  3680 + .tab-item-li,.Aview .tab-item-li{
  3681 + margin-right:30px;
  3682 + }
3609 .hzlc-sm{ 3683 .hzlc-sm{
3610 display: block; 3684 display: block;
3611 } 3685 }
@@ -3652,15 +3726,27 @@ blockquote:before { @@ -3652,15 +3726,27 @@ blockquote:before {
3652 .info-character.info-characterP{ 3726 .info-character.info-characterP{
3653 padding:50px; 3727 padding:50px;
3654 } 3728 }
  3729 + .func-bottom{
  3730 + margin:0;
  3731 + padding-top:0;
  3732 + }
3655 .func-bottom-intro{ 3733 .func-bottom-intro{
3656 padding:0 15px; 3734 padding:0 15px;
3657 flex:1; 3735 flex:1;
  3736 + /*background: #d95447;*/
  3737 + }
  3738 + .func-bottom-title{
  3739 + /*flex:1;*/
  3740 + height:50%;
3658 } 3741 }
3659 .func-l-p.func-bottom-intro{ 3742 .func-l-p.func-bottom-intro{
3660 padding: 0; 3743 padding: 0;
3661 } 3744 }
  3745 + .func-bottom-con-right{
  3746 + height:0;
  3747 + }
3662 .func-l-1{ 3748 .func-l-1{
3663 - flex:inherit; 3749 + /*flex:inherit;*/
3664 } 3750 }
3665 .funcIntro-span{ 3751 .funcIntro-span{
3666 padding-right:20px; 3752 padding-right:20px;
@@ -3682,10 +3768,6 @@ blockquote:before { @@ -3682,10 +3768,6 @@ blockquote:before {
3682 left:0; 3768 left:0;
3683 padding:15px; 3769 padding:15px;
3684 } 3770 }
3685 - .func-symbol{  
3686 - font-size: 50px;  
3687 - line-height: 20px;  
3688 - }  
3689 .count-text{ 3771 .count-text{
3690 /*原48px*/ 3772 /*原48px*/
3691 font-size: 30px; 3773 font-size: 30px;
@@ -3801,25 +3883,7 @@ blockquote:before { @@ -3801,25 +3883,7 @@ blockquote:before {
3801 background-image: url("../img/about/about-concat-bg-sm.png"); 3883 background-image: url("../img/about/about-concat-bg-sm.png");
3802 3884
3803 } 3885 }
3804 - .dataAbility-bg{  
3805 - /*background-image: url("../img/serviceSecond/Aview/ability-bg-sm.png");*/  
3806 - background-image: none;  
3807 - }  
3808 - .dataAbility-bg-logo{  
3809 - display: none;  
3810 - }  
3811 - .info-characterP .info-characterP-bg{  
3812 - /*background-image:url("../img/serviceSecond/Aview/characterP-bg-sm.png");*/  
3813 - background-image:none;  
3814 - background-color:#ffffff;  
3815 - border-radius: 3px;  
3816 - }  
3817 - .info-characterP:hover .info-characterP-bg{  
3818 - /*background-image:url("../img/serviceSecond/Aview/characterP-bg-active-sm.png");*/  
3819 - background-image:none;  
3820 - background-color:#1E9FFF;  
3821 - border-radius: 3px;  
3822 - } 3886 +
3823 .about-section .container{ 3887 .about-section .container{
3824 flex:1; 3888 flex:1;
3825 } 3889 }
@@ -3829,12 +3893,11 @@ blockquote:before { @@ -3829,12 +3893,11 @@ blockquote:before {
3829 .home-bg-1{ 3893 .home-bg-1{
3830 background: url(../img/index/1-sm.png); 3894 background: url(../img/index/1-sm.png);
3831 } 3895 }
3832 - .func-bottom{  
3833 - margin:0;  
3834 - } 3896 +
3835 .func-bg{ 3897 .func-bg{
3836 display: none; 3898 display: none;
3837 } 3899 }
  3900 +
3838 .func-bg-1{ 3901 .func-bg-1{
3839 background-image: url("../img/serviceSecond/cmdb/func-1-sm.png"); 3902 background-image: url("../img/serviceSecond/cmdb/func-1-sm.png");
3840 background-size: cover; 3903 background-size: cover;
@@ -3865,9 +3928,11 @@ blockquote:before { @@ -3865,9 +3928,11 @@ blockquote:before {
3865 background-repeat: no-repeat; 3928 background-repeat: no-repeat;
3866 flex-flow: column; 3929 flex-flow: column;
3867 } 3930 }
3868 - .func-bottom-title{  
3869 - flex:1; 3931 + .func-symbol{
  3932 + font-size: 50px;
  3933 + line-height: 20px;
3870 } 3934 }
  3935 +
3871 .funcIntro-span{ 3936 .funcIntro-span{
3872 padding-top:5px; 3937 padding-top:5px;
3873 } 3938 }
@@ -3877,21 +3942,7 @@ blockquote:before { @@ -3877,21 +3942,7 @@ blockquote:before {
3877 .logo-title{ 3942 .logo-title{
3878 display: none; 3943 display: none;
3879 } 3944 }
3880 - .dataAbility-col:nth-child(3) .dataAbility-item .dataAbility-item-intro-item:first-child{  
3881 - max-width: 100%;  
3882 - }  
3883 - .dataAbility-col:nth-child(2n) .dataAbility-item{  
3884 - margin-left:0;  
3885 - }  
3886 - .dataAbility-item{  
3887 - padding: 15px;  
3888 - background: #1E9FFF;  
3889 - margin: 8px 0;  
3890 - border-radius: 3px;  
3891 - }  
3892 - .dataAbility-con{  
3893 - margin-top:20px;  
3894 - } 3945 +
3895 .info-container-ability{ 3946 .info-container-ability{
3896 padding-top:20px; 3947 padding-top:20px;
3897 } 3948 }
@@ -3901,12 +3952,6 @@ blockquote:before { @@ -3901,12 +3952,6 @@ blockquote:before {
3901 .info-container-system,.info-container-service{ 3952 .info-container-system,.info-container-service{
3902 margin-bottom: 20px; 3953 margin-bottom: 20px;
3903 } 3954 }
3904 - .dataAbility-item-intro-item{  
3905 - min-height: auto;  
3906 - }  
3907 - .dataAbility-item-intro{  
3908 - padding-top:10px;  
3909 - }  
3910 .height-50{ 3955 .height-50{
3911 font-size: 14px; 3956 font-size: 14px;
3912 } 3957 }
@@ -51,7 +51,7 @@ @@ -51,7 +51,7 @@
51 <img :src="item.img" alt=""> 51 <img :src="item.img" alt="">
52 </div> 52 </div>
53 <div class="row mt-60 dataAbility-con" v-if="item.dataAbility && item.dataAbility.length>0"> 53 <div class="row mt-60 dataAbility-con" v-if="item.dataAbility && item.dataAbility.length>0">
54 - <div class="col-md-6 dataAbility-col" v-for="(itemD,indexD) in item.dataAbility"> 54 + <div class="col-lg-6 dataAbility-col" v-for="(itemD,indexD) in item.dataAbility">
55 <div class="dataAbility-item"> 55 <div class="dataAbility-item">
56 <div class="dataAbility-item-title">{{itemD.title}}</div> 56 <div class="dataAbility-item-title">{{itemD.title}}</div>
57 <div class="dataAbility-item-intro pt-20"> 57 <div class="dataAbility-item-intro pt-20">