Jelajahi Sumber

修改样式

Csy817 7 tahun lalu
induk
melakukan
971a027ccc
2 mengubah file dengan 37 tambahan dan 28 penghapusan
  1. 6 21
      src/app/App.jsx
  2. 31 7
      src/index.css

+ 6 - 21
src/app/App.jsx

@@ -23,28 +23,13 @@ class App extends Component {
                             <div className='logo'/>
                         </div>
                     </Header>
-                    <Content style={{padding: '30px 50px 0', minHeight: '780px' }}>
-                        <div style={{ background: '#fff'}}>
-                            <div className="intro-card" style={{ padding: '30px' }}>
+                    <Content style={{padding: '30px 50px 0', minHeight: '780px' }} >
+                        <div className="index" >
+                            <div className="intro" style={{ padding: '30px' }}>
                                 <Row gutter={16}>
-                                    <Col span={8}>
-                                        <Card title="无年费、最低成本、极速上线">
-                                            <p>案例商城扫码即可体验</p>
-                                            <p>选择案例一键部署生成结果</p>
-                                            <p>即刻拥有自己的公众号、小程序</p>
-                                        </Card>
-                                    </Col>
-                                    <Col span={8}>
-                                        <Card title="无服务器、无需维护、数据自有">
-                                            <p>再也不用购买服务器</p>
-                                            <p>再也不用专业人员维护服务器</p>
-                                            <p>数据完全属于自己哦!</p>
-                                        </Card>
-                                    </Col>
-                                    <Col span={8}>
-                                        <Card title="无卡死、无崩溃">
-                                            <p>再也不用担心用户一多,页面无法访问啦!</p>
-                                        </Card>
+                                    <Col span={24}>
+                                        <h2 >无年费&nbsp;&nbsp;&nbsp;&nbsp;数据完全私有</h2>
+                                        <h3>即刻拥有自己的微信公众号、小程序</h3>
                                     </Col>
                                 </Row>
                             </div>

+ 31 - 7
src/index.css

@@ -31,9 +31,9 @@ code {
 }
 
 .home-btn {
-    background: #fff;
+    /*background: #fff;*/
     padding: 24px;
-    min-height: 280px;
+    min-height: 320px;
     display: flex;
     justify-content: center;
     /*align-items: center;*/
@@ -55,16 +55,40 @@ code {
 .brief{
     text-align: center;
     font-size: 25px;
-    color: #3b3b3c;
-    margin-top: 30px;
+    /*color: #3b3b3c;*/
+    color: #379dfd;
+    margin-top: 200px;
+    font-weight: 600;
 }
 
-.intro-card p{
+.intro p{
     padding-bottom: 10px;
     color: black;
 }
 
-.intro-card .ant-card {
+.intro .ant-card {
     background-color: #f4f5f7;
     min-height: 214px;
-}
+}
+
+.intro h2{
+    text-align: center;
+    color: #fb8238;
+    font-size: 40px;
+    font-weight: 800;
+}
+
+.intro h3{
+    text-align: center;
+    color: #f99e66;
+    font-size: 20px;
+    font-weight: 800;
+}
+
+.index{
+    background: -webkit-linear-gradient(to top, #bcecf9 0%, #fee8e9 100%);; /* Safari 5.1 - 6.0 */
+    background: -o-linear-gradient(to top, #bcecf9 0%, #fee8e9 100%);; /* Opera 11.1 - 12.0 */
+    background: -moz-linear-gradient(to top, #bcecf9 0%, #fee8e9 100%);; /* Firefox 3.6 - 15 */
+    background-image: linear-gradient(to top, #bcecf9 0%, #fee8e9 100%); /* 标准的语法(必须放在最后) */
+}
+