鹤_-CSDN博客

原创 webpack打包方法总结

第一次使用webpack进行打包，遇到了很多的坑，老是报错，经过这个查查查，终于打包成功，这里的打包就是单纯打包js，没有和任何的框架配合使用，但是在执行过程中出现了很多的问题，现在已经逐步解决，大概流程了解了，但是还没有和深刻的理解，这里就是先做个笔记，以免以后遇到相同的情况，浪费时间。1.webpack打包基于node先下载node，下载地址：https://nodejs.org/en/dow...

2018-05-14 10:22:41 6912 2

原创 css实现单行文字、多行文字都垂直居中

有很多种方法可以实现这里我用两种方法来实现，一个是vertical-align，另一个是align-items具体实现如下：<!doctype html><html><head> <meta charset="utf-8"> <title>标题</title> <meta name="ke

2018-05-06 00:04:09 1319

原创 css布局实现单行文字水平居中，多行文字靠左

单行文字居中，多行文字靠左，需要css布局来实现，那么就需要用到两层元素，外面一层设置text-align:center;里面一层为行元素，需要设置text-align:left;这样有一行的时候因为里面是行内元素，有多少内容就多宽，而外面一层设置了text-align:center;所以会实现居中，当文字为多行的时候，由于本身设置了text-align:left，所以又会靠左显示。具体实现如下：...

2018-05-05 23:53:18 3983

原创 css利用padding百分比实现图片宽高成比例

有时需要做效果的时候需要实现一个效果就是一张单的图片或者轮播图，需要这个banner区域和屏幕的宽度进行适配，而且要求这个区域的宽高始终保持的相同的比例，比如保持比例4:3，并且随着屏幕进行自动的播放。最直观想到的可能是用js来实现，随时获取宽度并且计算出相对比例的高，然后进行赋值。但是这样很麻烦，纯css就可以实现。就是padding值这个属性,padding值在设置为百分比的时候，高度是根据宽...

2018-05-05 23:31:58 1459

原创关于子父元素margin值重叠的问题解决方案

当父元素当中有一个子元素的时候，子元素设置margin-top或者margin-bottom的时候会不起作用，也就是子父元素之间并没有产生间距，但是这个值作用到了父元素的身上。具体代码如下：<!doctype html><html><head> <meta charset="utf-8"> <title>标题</title&am

2018-05-01 00:11:23 1202

原创关于多行文字和序号或者图片对齐的问题

在写页面的过程中经常遇见这样的样式（1）多行文字和序号顶部对齐实现的办法有很多种，比如序号和文字在两个标签内直接设置一个顶部对齐的属性vertial-align:top;即可对齐，这种虽然易实现，但是会对写一个标签实现的方法如下：那么如果序号和文字在一个段落里面，就有一个更简单的方法直接用text-indent属性来实现，不需要多加标签，一个属性就可以实现，具体代码如下（推荐使用）<!doc...

2018-04-27 00:03:42 3487

原创 css中的子元素设置margin-top或者margin-bottom作用到父元素上的问题

写页面的时候要实现这样一个效果要求：图标之间有一条线进行连接，最上边和最下边的图标没有线进行连接，数据动态加载图标和线也动态生成一、第一种实现方法横着的每条数据是一个父级，然后所有的数据又是一个父级，然后给最外层的父级加border-left,然后每条数据设置一个margin-left的负值，每条数据之间的间距用margin-bottom来设置，具体实现如下<!doctype html&gt...

2018-04-26 14:41:18 4811

原创前端面试题整理

1.两个div标签，如何控制标签左边固定，右边自适应，左边div宽度为100px.(1)左边设置浮动，右边不设置宽度自定布局到右边<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title&gt

2018-03-22 16:53:55 2236

weixin_39855431的博客