10 2019 档案
摘要：PC端 特点 PC端的屏幕具备以下特点： 屏幕大小一般是大于 13.3英寸 用户会经常拖拉浏览器的大小 原因 正是因为 PC端上的浏览器大小会经常被改变，而且改变的范围还很大，用户会全屏浏览器，用户也会缩小浏览器到一个很小的值，如600px左右。 所以pc端上如果使用流式布局(百分比布局)，会导致页
阅读全文
摘要：移动端 特点 移动端下的屏幕存在以下特点： 屏幕相比较于PC端要小 浏览器不像PC端，随时各种调整大小 原因 移动端由于屏幕整体比PC端小，而且也不能出现拖动浏览器来调整大小的情况，所以在移动端上的布局是流式布局最多，其中有些小分支，如固定小版心。 案例 代码 普通的图片和容器，写单位的时候换成 百
阅读全文
摘要：何为沉浸式设计 我们可以将为了沉浸式（心流）而进行的设计可以称之为沉浸式设计（为心流而设计）。 沉浸模式就是突出内容，排除干扰，对界面除内容以外的东西尽可能的进行圆润的简化，将用户所关注的内容最大程度的呈现于屏幕之上。 沉浸式设计案例 而沉浸式设计的例子通常就是隐藏状态栏以及导航栏等元素 京东的支付
阅读全文
摘要：z-index简单介绍 首先z-index只对定位元素有效，什么是定位元素呢，也就是设置了position属性的元素，position：relative--相对定位，position：absolute--绝对定位，position：fixed--固定定位，position：static静态定位，po
阅读全文
摘要：Deeplink应用描述 Deeplink，简单讲，就是你在手机上点击一个链接之后，可以直接链接到app内部的某个页面，而不是app正常打开时显示的首页。不似web，一个链接就可以直接打开web的内页，app的内页打开，必须用到deeplink技术。 想要在h5页面中唤起app的某个页面也要用到该技
阅读全文
摘要：介绍 pointer-events是css3的一个属性，指定在什么情况下元素可以成为鼠标事件的target（包括鼠标的样式） 属性值 pointer-events属性有很多值，但是对于浏览器来说，只有auto和none两个值可用，其它的几个是针对SVG的(本身这个属性就来自于SVG技术)。 /* K
阅读全文
摘要：方法一：使用for...in for...in... 遍历属性，为真则为“非空数组”；否则为“空数组” for (var i in obj) { return true // 如果不为空，则会执行到这一步，返回true } return false // 如果为空,返回false 方法二：使用JSO
阅读全文
摘要：前言 最近在开发时遇见一个问题 我们知道a标签的disabled属性部分浏览器支持，但是尽管设置了disabled属性也无法阻挡任何鼠标经过或是点击事件的，那么如何实现a标签按钮的禁用呢? 转换一下思维，设置disabled属性的元素表现为不能点击、无法获得光标焦点，那么我们不用disabled属性
阅读全文
摘要：前言 em 和 rem 都是相对单位，在使用时由浏览器转换为像素值，具体取决于您的设计中的字体大小设置。 如果你使用值 1em 或 1rem，它可以被浏览器解析成 从16px 到 160px 或其他任意值。 最大问题 使用 em 和 rem 单位可以让我们的设计更加灵活，能够控制元素整体放大缩小，而
阅读全文
摘要：瀑布流布局（基于多栏列表流体布局实现）
阅读全文
摘要：em布局/rem布局 em和rem的区别 在了解弹性布局前我们需要先知道em和rem rem：font size of the root element，rem是相对于根元素<html>来设置字体大小的，这就意味着，我们只需要根据自己的需求在根元素确定一个参考值。 em：以使用em为单位的元素本身的
阅读全文
摘要：响应式布局 概念 响应式布局指的是同一页面在不同屏幕尺寸下有不同的布局 布局特点 响应式设计的目标是确保一个页面在所有终端上（各种尺寸的PC、手机、手表、冰箱的Web浏览器等等）都能显示出令人满意的效果，对CSS编写者而言，在实现上不拘泥于具体手法，但通常是糅合了流式布局+自适应 布局。分别为不同的
阅读全文
摘要：自适应布局 概念 自适应布局（Adaptive Layout）是对凡是有自适应特性的一类布局的统称 自适应布局使用media query来检测当前浏览器的宽度进而通过CSS样式调整页面大小。自适应布局和静态布局类似也是采用绝对长度单位（px、pt、mm、cm、in），但不同点在于它通过media q
阅读全文
摘要：流体布局 什么是流 在谈论流体布局之前我们需要知道一件事情就是何为“流”，所谓“流”就是“文档流”，是css中的一种基本定位和布局 概念 流体布局（Liquid/Fluid Layout）指的是利用元素“流”的特性实现的各类布局，流式布局采用了相对长度单位（%、em、rem、vm、vh）。典型的流式
阅读全文
摘要：前言 当为大量用户设计网站时，设计人员必须考虑到访问者的差异： 屏幕分辨率， 浏览器的选择， 是否在浏览器最大化状态， 浏览器的额外工具栏的开启（历史记录，书签等）， 操作系统和硬件。 屏幕分辨率， 浏览器的选择， 是否在浏览器最大化状态， 浏览器的额外工具栏的开启（历史记录，书签等）， 操作系统和
阅读全文
