我现在说的是PC端的一些经验： 1.百分比布局。 或者用 bootstrap的栅格布局。html和body高度宽度设置为100%;在里面的块级元素设置为百分比布局 ...
分类：
Web程序 时间：
2018-06-28 10:58:55
阅读次数：
136
图片宽高不固定 ，一样实现自适应，拉伸裁剪不变形，适应各大兼容性。 好用 不好用 下面是代码：直接放个div就OK啦。 ...
分类：
Web程序 时间：
2018-06-20 13:03:43
阅读次数：
5035
一，使用 JS，先上效果图，右图为定死宽高的效果，左图为处理之后的 1， 主要思路是，在图片 onload 后，将图片的宽高比和 div 容器的宽高比进行比较， 2， 从而确定拉伸或者压缩之后是宽还是高不足以填充容器 3，将不足以填充容器的方向设置为和容器一致 4，此时，图片的另一个方向可能超出容器 ...
分类：
其他好文 时间：
2018-06-20 12:49:18
阅读次数：
111
图片外面的div设置宽高自适应width: 100vw; max-width: 640px; display: block; height: 43.75vw; max-height: 280px; flex布局列表换行 display: flex; justify-content: space-be ...
分类：
移动开发 时间：
2018-05-31 19:17:41
阅读次数：
260
对于刚接触到html的一些人经常会用到浮动布局，但对于浮动的使用和清除浮动来说是大为头痛的，在这里介绍几个关于清除浮动的的方法。如果你说你要的就是浮动为什么要清除浮动的话，我就真的无言以对了，那你就当我没说。 关于我们在布局的时候，经常会用到浮动和定位，特别是涉及到宽高自适应的网站布局时，就经常会出 ...
分类：
其他好文 时间：
2018-05-05 14:18:27
阅读次数：
166
一、宽度自适应 语法：width:100%; 注： a）块状元素的默认宽度为100% b) 当给元素设置宽度为100%时，继承父元素的宽度 c) 通常使用宽度自适应实现通栏效果 二、高度自适应 语法：height:auto;（等同于不给元素设置高度） 三、最小高度，最大高度，最小宽度，最大宽度 1. ...
分类：
Web程序 时间：
2018-01-02 23:32:32
阅读次数：
236
在我们 编写css 样式的时候经常会遇见一个问题 那就是一个 宽高未知的元素 要让他 垂直居中如何实现这个呢 下面是我常用的两种方法 上代码 下面的是 结构代码 <div class="wrap">//此处为父组件 我们会设置父级的宽高并让其居中 <div class="center">//子组件我 ...
分类：
Web程序 时间：
2017-09-14 10:19:20
阅读次数：
212
如果说宽高自适应那么大家可能会想到 但是如果我要自适应的同时还要变成矩形呢？（高度和宽度相等而高度不能写死） 那就要实现如下的黑科技了 根据w3c 标准，当padding值为 100% 时 其相等于元素自身的宽度，所以把padding-top 或者 padding-bottom 为 100% 的时候 ...
分类：
Web程序 时间：
2017-08-17 14:39:59
阅读次数：
135
一、首先是喜闻乐见的position方法，经典且万能，用法如下： 不需要水平居中可以去掉left和margin-left。 划重点：需要父元素和子元素都定义宽高，自适应是不可能自适应的，这辈子都不可能自适应的。 二、 display:table-cell能够使大小不固定的元素实现垂直居中布局，先来一 ...
分类：
其他好文 时间：
2017-07-23 19:39:35
阅读次数：
200
一、宽高自适应 自适应指的就是指其宽度可以根据浏器窗口的大小自动改变其宽度（随浏览器宽度的改变而改变）,而不会被浏览器遮住。案例： 二、first-child 和first-of-type ...
分类：
其他好文 时间：
2017-07-18 23:07:35
阅读次数：
248
