前端入门篇之div

Backache 发布于2019-08-30 13:55 / 1907人阅读

摘要：由于之前没有做过前端的开发工作，在现在的前端开发工作中遇到许多坑，有关于的，有关于样式的，所以想在这里总结一下。文章的结构的可能会比较混乱，同一篇文章可能会有多次的修改。

由于之前没有做过前端的开发工作，在现在的前端开发工作中遇到许多坑，有关于javascript的，有关于css样式的，所以想在这里总结一下。文章的结构的可能会比较混乱，同一篇文章可能会有多次的修改。

div显示在同一行中

div是块级元素，默认是不会显示在同一行的，但是可以通过如下方式，让div元素显示在同一行中。

使用float样式

    .left{
        float: left;
    }
    .right{
        float: right;
    }

    
        child1
        child2
        child3
        child4

使用inline

    .inline{
      display:inline-block;
    }
    
    
      inline1
      inline2

使用inline方式存在一个问题，在预览的时候会发现两个元素(例如上面的inline1和inline2)之间会存有留白，这个留白是由于两个

之间的空白字符造成的(包括空格、Tab和换行)。网上有很多方式可以消除这个留白，在这里就不详细表述了。

使用flex

本人使用flex方式还没有成功，待测试成功之后再来补充...

reactjs行内样式

这个很简单，但是很多初学者会在这里踩坑。我根据baidu搜索出来的方法在react中使用行内样式，实际并不成功。我不清楚是什么原因，或许是版本不同？？？不过，我下面的内容都是亲测可用的。

普通html

reactjs

注意哦，"hidden"使用的是单引号

div的flex样式

云服务器 GPU云服务器入门前端前端入门前端快速入门前端开发入门

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/115638.html

JQuery干货篇之插入元素

摘要：在匹配元素集合中的每个元素后面插入参数所指定的内容，作为其兄弟节点。当需要移走一个元素，不久又将该元素插入时，这种方法很有用。实例从中移除集合中匹配元素的所有子节点。 JQuery干货篇之插入元素本次使用的html,css还是我上一篇的源代码，详情请看上一篇文章分类插入子元素：append,prepend ,appendTo,prependTo 封装包裹元素：wrap,wrap...

jemygraw 2019-08-29 12:27 评论0 收藏0
JQuery干货篇之插入元素

摘要：在匹配元素集合中的每个元素后面插入参数所指定的内容，作为其兄弟节点。当需要移走一个元素，不久又将该元素插入时，这种方法很有用。实例从中移除集合中匹配元素的所有子节点。 JQuery干货篇之插入元素本次使用的html,css还是我上一篇的源代码，详情请看上一篇文章分类插入子元素：append,prepend ,appendTo,prependTo 封装包裹元素：wrap,wrap...

songze 2019-08-20 15:58 评论0 收藏0
前端工程化篇之 Gulp

摘要：是一个构建工具，基于的平台运行，使用的是的模块化语法。我们使用需要用到的包一个任务，对应一个包，对应一个处理逻辑对应的是同步任务，从左到右，依次执行任务。时间长对应的是异步任务，效率高，时间短。 gulp 是一个构建工具，基于Node.js的平台运行，使用的是commonJs的模块化语法。我们使用gulp需要用到的包一个TASK任务，对应一个包，对应一个处理逻辑、 gulp.s...

Donald 2019-08-23 16:20 评论0 收藏0
前端工程化篇之 Gulp

摘要：是一个构建工具，基于的平台运行，使用的是的模块化语法。我们使用需要用到的包一个任务，对应一个包，对应一个处理逻辑对应的是同步任务，从左到右，依次执行任务。时间长对应的是异步任务，效率高，时间短。 gulp 是一个构建工具，基于Node.js的平台运行，使用的是commonJs的模块化语法。我们使用gulp需要用到的包一个TASK任务，对应一个包，对应一个处理逻辑、 gulp.s...

LeanCloud 2019-08-02 16:09 评论0 收藏0