随笔分类 - web前端常见效果集锦
摘要：HTML CSS JavaScript 实际效果例图：
阅读全文
摘要：先放上腾讯官网的简便源码： 视频背景时，要注意最重要的一个点： 蒙版是否遮盖住了视频控件（右击） HTML： CSS： 常规的代码： 1.需要布局（控制视频的高度） 2.右键无法选中（蒙版） 3.文字排版（float还是before） CSS代码实现的常规代码： 2018-4-9|有缺陷（无法正常响
阅读全文
摘要：传统的layzload只能适用于图片懒加载，而我们现在需要的是全部元素的懒加载！ 官网：https://scrollrevealjs.org/ gitHub：https://github.com/jlmakes/scrollreveal 提供了两种使用方式： 1.使用script标签（提供国内加载）
阅读全文
摘要：Browsersync 先下载：nodejs ,然后安装完以后，我们在命令行打印 node -v 完成后我们进行以下操作，安装browser-sync ,官网上有详细的教程，请访问：Browsersync 因为npm官网访问速度太慢造成的下载速度奇慢，我做了如下调整： 使用淘宝源，我使用的代码如下红
阅读全文
摘要：代码来源于：这位Github小伙伴，我只负责解说！ 效果图如下： 先上HTML代码 源码： head注释： 先从head标签开始 meta： 包含网页的一些元信息，至于包含那些元信息，后面的文章将介绍到 charset ：请求到的网页编码（一般是gb2312和utf-8） referrer：可以看这
阅读全文
摘要：轮播图的展示效果是显而易见： HTML代码如下 疑问一：为什么用id? 方便获取被操作的元素 疑问二：为什么轮播图加类“on”? 为了方便操作，如果加了"on"，即说明当前图片正在轮播 疑问三： 疑问四：为什么加了一个单独的样式，style = left: -600px; 为了实现轮播图偏移量。 C
阅读全文
