2017-11-17(TW实习)

问题一

情景描述: 使用antdesign的table样式,想要每一行之间都有一定的距离,在使用border是无法显示

矛盾点:想的是因为tr属于行级标签,是不可以应用border这个属性,只能像padding这样通过padding-right或者padding-left这样使用,margin是肯定用不了了,将tr的display属性修改为inline-block后,border以及margin样式是有了,但是antdesign原有的样式又被破坏了

解决方案:table中有两个不常见的属性

border-collapses 用于table样式border是否合并
border-spacing  用于table 中td和tr之间的距离

ACTION:经过实践发现

  • 行级标签也是可以应用border属性的
  • table中给tr应用display:block属性再maigin也是可行的
  • 在antdesign下的table就得用border-left 和border-right给左右两边加上border

收获

  • 之前在面试的时候总会被问到e.preventDefault()方法的作用,现在通过在代码中实际应用有理解更深了,用于组织节点默认事件的触发
  • 项目实际应用中总会有
::this.handleSubmit

这样的代码去直接出发函数

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,790评论 1 92
  • 一 外部式css样式 (也可称为外联式)就是把css代码写一个单独的外部文件中,这个css样式文件以“.css...
    KunMitnic阅读 960评论 0 1
  • 1、垂直对齐 如果你用CSS,则你会有困惑:我该怎么垂直对齐容器中的元素?现在,利用CSS3的Transform,...
    kiddings阅读 3,195评论 0 11
  • 本课来自http://www.imooc.com/learn/9请不要用作商业用途。 HTML5 HTML介绍 H...
    PYLON阅读 3,305评论 0 5
  • 一要有目标,二要有步骤,三要有办法
    HakunaMatata18阅读 172评论 0 0