Commit df3a59d7 authored by wuhao's avatar wuhao 🎯

zxcdf

parent f1cacbdb
...@@ -74,32 +74,31 @@ body, ...@@ -74,32 +74,31 @@ body,
background-position: 0% 50%; background-position: 0% 50%;
} }
} }
* { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
#webFooter { #webFooter {
width: 100%; width: 100%;
/* height: 400px; */ /* height: auto; */
background-color: black; background-color: black;
} }
#webFooter > div:first-child { #webFooter > div:first-child {
height: calc(100% - 40px); /* height:calc(100% - 40px) ; */
padding: 50px 50px 80px 80px; padding: 50px 50px 80px 80px;
display: flex; /* display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between; */
} }
.footer-copyright { .footer-copyright {
color: rgba(194, 194, 194, 1); color: rgba(194, 194, 194, 1);
border-top: 1px solid rgba(194, 194, 194, 1); border-top: 0.5px solid rgba(194, 194, 194, 1);
font-size: 14px; font-size: 14px;
font-family: 'HarmonyOS Sans SC'; font-family: 'HarmonyOS Sans SC';
padding: 16px;
text-align: center; text-align: center;
padding: 16px 0;
} }
.footer-content h3 { .footer-content h2 {
margin-bottom: 24px; margin-bottom: 24px;
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
font-family: '黑体'; font-family: '黑体';
...@@ -148,6 +147,7 @@ body, ...@@ -148,6 +147,7 @@ body,
height: 100px; height: 100px;
margin-top: 32px; margin-top: 32px;
display: flex; display: flex;
/* flex-wrap: wrap; */
justify-content: space-between; justify-content: space-between;
} }
.contact span { .contact span {
...@@ -183,6 +183,58 @@ body, ...@@ -183,6 +183,58 @@ body,
width: 100px; width: 100px;
height: 100%; height: 100%;
} }
@media only screen and (max-width: 575px) {
.contact > div {
width: 100%;
height: auto;
margin-top: 32px;
display: block;
/* flex-wrap: wrap; */
/* justify-content: space-between; */
}
.contact span {
position: absolute;
font-size: 12px;
color: rgba(255, 255, 255, 1);
}
.nangao {
height: 150px;
position: relative;
background-repeat: no-repeat;
background-position: 0 0;
background-size: cover;
width: 150px;
}
.lianmeng {
height: 150px;
position: relative;
background-repeat: no-repeat;
background-position: 0 0;
background-size: cover;
width: 150px;
margin-left: 0;
margin-right: 0;
margin-top: 40px;
}
.cujinhui {
position: relative;
background-repeat: no-repeat;
background-position: 0 0;
background-size: cover;
width: 150px;
height: 150px;
margin-top: 40px;
}
.footer-copyright {
height: auto;
/* padding-left: 32px; */
color: rgba(194, 194, 194, 1);
/* border-top: 0.5px solid rgba(194, 194, 194, 1); */
/* line-height: 40px; */
font-size: 14px;
font-family: 'HarmonyOS Sans SC';
}
}
@media (min-width: 1024px) { @media (min-width: 1024px) {
html { html {
......
import React, { useState } from 'react'; import React, { useState } from 'react';
import { Col, Row } from 'antd';
const ContentList = (props) => { const ContentList = (props) => {
const { title, listData } = props; const { title, listData } = props;
return ( return (
<div className="footer-content"> <div className="footer-content">
<h3>{title}</h3> <h2>{title}</h2>
<div> <div>
{listData.map((item, index) => ( {listData.map((item, index) => (
<li> <li>
...@@ -84,43 +85,55 @@ export default () => { ...@@ -84,43 +85,55 @@ export default () => {
return ( return (
<div id="webFooter"> <div id="webFooter">
<div> <div>
<ContentList title="关于南高" listData={list1} /> <Row style={{ display: 'flex', justifyContent: 'space-around' }}>
<ContentList title="智能工厂解决方案" listData={list2} /> <Col xs={24} sm={8} xl={8} xxl={6}>
<ContentList title="下载中心" listData={list3} /> <ContentList title="关于南高" listData={list1} />
<div className="footer-content"> </Col>
<button>联系我们</button> <Col xs={24} sm={8} xl={8} xxl={6}>
<div className="contact"> <ContentList title="智能工厂解决方案" listData={list2} />
<li>电话&nbsp;&nbsp;&nbsp;&nbsp;025-86111901</li> </Col>
<li>邮箱&nbsp;&nbsp;&nbsp;&nbsp;center@jsnangao.com</li> <Col xs={24} sm={8} xl={8} xxl={6}>
<li>地址&nbsp;&nbsp;&nbsp;&nbsp;南京市江宁开发区东南大学路33号</li> <ContentList title="下载中心" listData={list3} />
<div> </Col>
<div <Col xs={24} sm={24} xl={24} xxl={6}>
className="nangao" <div className="footer-content">
style={{ <button>联系我们</button>
backgroundImage: `url(${require('@/assets/code1.jpg')})`, <div className="contact">
}} <li>电话&nbsp;&nbsp;&nbsp;&nbsp;025-86111901</li>
> <li>邮箱&nbsp;&nbsp;&nbsp;&nbsp;center@jsnangao.com</li>
<span>南高公众号</span> <li>
</div> 地址&nbsp;&nbsp;&nbsp;&nbsp;南京市江宁开发区东南大学路33号
<div </li>
className="lianmeng" <div>
style={{ <div
backgroundImage: `url(${require('@/assets/code2.jpg')})`, className="nangao"
}} style={{
> backgroundImage: `url(${require('@/assets/code1.jpg')})`,
<span>联盟公众号</span> }}
</div> >
<div <span>南高公众号</span>
className="cujinhui" </div>
style={{ <div
backgroundImage: `url(${require('@/assets/code3.jpg')})`, className="lianmeng"
}} style={{
> backgroundImage: `url(${require('@/assets/code2.jpg')})`,
<span>促进会公众号</span> }}
>
<span>联盟公众号</span>
</div>
<div
className="cujinhui"
style={{
backgroundImage: `url(${require('@/assets/code3.jpg')})`,
}}
>
<span>促进会公众号</span>
</div>
</div>
</div> </div>
</div> </div>
</div> </Col>
</div> </Row>
</div> </div>
<div className="footer-copyright"> <div className="footer-copyright">
Copyright © 2017 Copyright © 2017
......
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