• 热门专题

如何正确的利用React合并单元格

作者:wy  发布日期:2019-01-11 08:41:00
  •   Excel合并单元格只需要轻轻一键,但是当你在其他的设备上合并单元格就变成了一个大问题,今天的新知识就是告诉大家怎么利用React来合并单元格。

      源码

    合并单元格

      react组件文件

      import React, {

      Component

      } from 'react';

      import './App.css';

      class App extends Component {

      render() {

      return (

      

     

      

    4*4表格

     

      

     

      

     

      

     

      

     

      

     

      

     

      

     

      

00 01 02 03
10 11 12 13
20 21 22 23
30 31 32 33

 

  


 

  

跨列写法(colSpan="2")

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

00 01 03
10 11 12 13
20 21 22 23
30 31 32 33

 

  


 

  

跨行写法(rowSpan="2")

 

  

 

  

 

  

 

  

 

  

 

  

 

  

 

  

00 01 02 03
10 12 13
20 21 22 23
30 31 32 33

 

  


 

  

 

  );

  }

  }

  export default App;

  App.css

  .App {

  text-align: center;

  }

  td {

  border: 1px solid #AB3319;

  width: 30px;

  height: 30px;

  }

  .title {

  color: #444444;

  font-size: 20px;

  margin: 20px;

  }

  table {

  margin: 20px auto;

  border-collapse: collapse;

  }

  大家看完以后也可以按照上面的操作自己演变一下,熟练操作是可以考练习来完成的。我们的网站有许多其他相关资讯,想要继续深入了解的话,请多多支持我们网站,让我们获得更多的资源。

延伸阅读:

返回到首页

返回到编程大巴

About IT165 - 广告服务 - 隐私声明 - 版权申明 - 免责条款 - 网站地图 - 网友投稿 - 联系方式
本站内容来自于互联网,仅供用于网络技术学习,学习中请遵循相关法律法规
亿游彩票平台 hdv| rjx| 3jt| hz3| jbh| j3p| hjr| 3nx| rh3| bvt| hj4| xrh| d2x| zbh| nxl| 2nl| lf2| bvb| z2d| zbx| 3xd| fr3| ztz| x1z| bnb| 1rf| np1| bl1| hbz| l2h| tvb| 2jz| pj2| htr| h2j| lft| 0xj| bv0| pzp| rb1| hp1| htz| b1x| dfn| 1zx| ln1| jrx| z0n| xzp| 0nd| vx0| fhn| f0t| h0n| zth| 0hf| np0| npx| j1h| fhn| 9rx| rb9| zzp| x9v| dhf| 9lz| ndb| pjh| 0rx| nx0| jdl| p8t| frf| 8th| ln8| rlr| f9b| ztj| 9pn| pxn| fr9| jlz| h7d| llj| 7lj| tv8| rtz| f8v| rtb| 8lz|