-
HTML5 视频背景插件vidbacking
简要教程 vidbacking是一款响应式的，跨平台的 html5视频背景插件。该视频背景插件允许你在页面中的某个div后整个页面中使用HTML5视频作为背景。如果浏览器不支持HTML5视频，插件会自动将背景回退为指定的背景图片。 使用方法 在页面中引入jquery和jquery.vidbacking.js，以及jquery.vidbacking.css文件。 // 由青梅博客整理nsdn.cn…- 737
- 0
-
2021年web前端面试集锦
一. HTML、CSS相关 html5新特性、语义化 语义化标签 ： header nav main article section aside footer 语义化意味着顾名思义，HTML5的语义化指的是合理正确的使用语义化的标签来创建页面结构，如 header,footer,nav，从标签上即可以直观的知道这个标签的作用，而不是滥用div。 语义化的优点有: 代码结构清晰，易于阅读，利于开发和…- 1.1k
- 0
-
Vue项目优化首页加载速度
一、路由懒加载 { path: '/index', component: () => import('@/views/index'), //懒加载-访问该页面才加载 } 这一步之后，打包后会发现很大的chunk-vendors.xxxxxxx.js不见了，其实是分成了不同的js文件 二、使用CDN引入 <script src="http…- 833
- 0
-
Web前端如何进行SEO结构优化
做前端的肯定离不开SEO，无论您是专职的SEOer还是其他什么别的，只要设计到前端就避不开SEO，前前后后做了几十个网站和个人博客网站建设的我，对与SEO仍然出于小白阶段，下面就介绍一下日常SEO注意的知识点： 一、合理的title、description、keywords 搜索对着三项的权重逐个减小，title值强调重点即可；description把页面内容高度概括，不可过分堆砌关…- 775
- 0
-
2021 年你应该尝试的 8 个 React 库
1. react-select 一个厉害的，强大的表单下拉选择框的库 代表了一种开发功能强大的 react.js 组件的全新方式，这些组件在完全可定制的同时开箱即用。 突出的功能特性 灵活的数据处理方法，具有可定制的功能。 灵活结合 emotion 这个库(一个 css in js 的强大的库 ). 组件注入API，用于完全控制UI行为。 选项组、portal 支持、动画等。 安装: npm i …- 992
- 0
-
前端工具VScode+NodeJs+Git下载配置
下载vscode需要用到node.js和git 一、安装NodeJs 1.下载Nodejs Node.js官网下载地址:https://nodejs.org/en/download/ Node.js历史版本下载地址：https://nodejs.org/zh-cn/download/releases/ tips:脚本语言需要一个解析器才能运行，JavaScript是脚本语言，在不同的位置有不一样的…- 2k
- 0
-
WebSocket 实现数据实时刷新
WebSocket 是HTML5的一个新协议，WebSocket 使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在 WebSocket API 中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。 一、浏览器客户端 创建一个WebSocket 对象 浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接…- 1.1k
- 0
-
JS使用lazyload进行图片懒加载
原理： 图片的加载是由src引起的，当对src赋值时浏览器会请求图片资源，基于这个，可以利用html5的属性data-xxx来保存图片的路径，当我们需要加载图片的时候才将data-xxx的值赋予src。就能实现图片的按需加载了，也就是懒加载了 方法： 1.使用lazyload插件，引用jquery.js和jquery.lazyload.js 2.将img标签中的src属性赋值为加载图片，即一张临时…- 860
- 0
-
vue-router 的基本使用和路由守卫
路由中有三个基本的概念 route, routes, router 1， route，它是一条路由，由这个英文单词也可以看出来，它是单数， Home按钮 => home内容， 这是一条route, about按钮 => about 内容， 这是另一条路由。 2， routes 是一组路由，把上面的每一条路由组合起来，形成一个数组。[{home 按钮 =>home内容 }， { a…- 749
- 0
-
从0到1搭建webpack2+vue2自定义模板详细教程
前言 webpack2和vue2已经不是新鲜东西了，满大街的文章在讲解webpack和vue，但是很多内容写的不是很详细，对于很多个性化配置还是需要自己过一遍文档。Vue官方提供了多个vue-templates，基于vue-cli用的最多，不过对于很多人来说，vue-cli 的配置还是过于复杂，对于我们了解细节实现不是很好，所以想自己从零开始搭建一个模板工程，也顺便重新认识一下webpack和vu…- 1k
- 0
-
Meta 标签使用详解
meta是html语言head区的一个辅助性标签。几乎所有的网页里，我们可以看到类似下面这段的html代码： <head><meta http-equiv="content-Type" content="text/html; charset=gb2312"></head> 也许你认为这些代码可有可无。其实如果你能够用好…- 1k
- 0
-
vue-router嵌套子路由实际使用
前端路由的定义 在spa流行之前，前端路由是没有的；而像java之类的后台语言很早就有了，后端路由一般就是定义一系列的访问地址规则，路由引擎根据这些规则匹配并找到对应的处理页面，然后将请求转发给页面进行处理。在spa应用中，前端路由是直接找到与地址匹配的一个组件或对象并将其渲染出来。改变浏览器地址而不向服务器发出请求有两种做法，一是在地址中加入#以欺骗浏览器，地址的改变是由于正在进行页内导航；二是…- 826
- 0
-
H5拖放原生js将图片拖放另外一个元素里
1：什么是拖放？ 拖放是一种常见的特性，即抓取对象以后拖到另一个位置。在 HTML5 中，拖放是标准的一部分，任何元素都能够拖放 2：元素的可拖放 draggable 属性设置为 true <img draggable="true"> 3：元素中的拖放事件 通过拖放事件，可以控制拖放相关的各个方面。其中最关键的地方在于确定那里发生了拖放事件，有些事件是在被…- 1k
- 0
-
JS实现div块的拖放，调换位置
主要是HTML5 的拖放（Drag 和 Drop） 例子（不需要对div设置ID）： <!DOCTYPE HTML> <html> <head> <script type="text/javascript"> function allowDrop(ev) { ev.preventDefault(); } var srcdiv = …- 746
- 0
-
前端常见的6种HTML5错误用法
一、不要使用section作为div的替代品人们在标签使用中最常见到的错误之一就是随意将HTML5的<section>等价于<div>——具体地说，就是直接用作替代品(用于样式)。在XHTML或者HTML4中，我们常看到这样的代码： <!-- HTML 4-style code --><div id="wrapper"> <…- 1k
- 0
-
HTML5 WebSockets 基础使用教程
摘要：HTML5之中一个很酷的新特性就是WebSockets，它可以让我们无需AJAX请求即可与服务器端对话。今天彬Go将让大家通过Php环境的服务器端运行WebSocket，创建客户端并通过WebSockets协议发送和接收服务器端信息。 什么是WebSockets？ WebSockets是在一个(TCP)接口进行双向通信的技术，PUSH技术类型。同时WebSockets仍将基于W3C标准，目…- 917
- 0
-
前端Js框架汇总
概述： 随着互联网飞速发展的时代，技术更新迭代的速度也在加快。看着Java、Js、Swift在各领域心花路放，也是煞是羡慕。寻了寻.net的消息，也是振奋人心，.net core 1，mono，xamarin等等，但大多都还在狂吼的阶段。其实一直以来对技术的理解是技术服务于业务和产品，产品又在不同程度的推进着技术的演进。 Web、无线、物联网、VR、PC从不同方向推进着技术的融合与微创新。程序员在…- 1.1k
- 0
-
15个精美的 HTML5 单页网站作品欣赏
HTML5 是现在Web开发领域的热点，更多的开发人员开始使用HTML5来开发交互性强、效果出众的Web应用和游戏。今天，本文收集了15个精美的 HTML5 单页网站作品，让大家感受一下 HTML5 的魅力，一起欣赏。 Digitalhands Hellocarbon Morehazards Bokicabo Mindepic Tejpotter Unfold Shweplantis Vertaa…- 1k
- 0
-
开源好用的富文本编辑器推荐
最近项目里常听产品们谈到后台的文本编辑器就烦恼，吐槽样式难看，说后台效果和前台展示不一样，还有吐槽操作不方便功能不全没有自定义功能的问题。头疼也要解决，假若用着用着被迫换编辑器，用户和团队估计要件要崩溃。 本着开源世界解决一切的宗旨，我又开始逛荡这github大市场了。以Github stars数为主要的评估依据，兼顾最新更新日期和提交数量，以保证框架能够让我们用的更长久。 Quill：丰俭由人的…- 1.1k
- 0
-
HTML a标签打开新标签页避免出现安全漏洞，请使用“noopener”
新标签页中打开一个网址如何出现安全漏洞 让我们在网站上的新标签页中打开一个网址，HTML如下 <a href="https://nsdn.cn" target="_blank"> 访问恶意网站！</a> 这里我们有一个指向恶意网站的 href 属性，并以 _blank 属性为 target，使其在新标签页中打开。 用户从你的页面重定向…- 1.9k
- 0
-
Gulp和Webpack对比
前言 在现在的前端开发中，前后端分离、模块化开发、版本控制、文件合并与压缩、mock数据等等一些原本后端的思想开始逐渐渗透到“大前端”的开发中。前端开发过程越来越繁琐，当今越来越多的网站已经从网页模式进化到了 Webapp 模式。它们运行在现代的高级浏览器里，使用 HTML5、 CSS3、 ES6 等更新的技术来开发丰富的功能，网页已经不仅仅是完成浏览的基本需求，并且Webapp通常是一个单页面应…- 676
- 0
-
Adobe Flash Player 32.0.0.371 绿色特别版
Adobe Flash Player 32 正式版例行更新，v32.0.0.371 这是最新详细版本号，Adobe采取和微软相似的更新策略，在每个月的第二个周二为产品发布安全更新。Adobe® Flash® Player控件一直是Windows系统必装的浏览器网页视频播放支持插件，但由于其播放卡慢并且漏洞较多，如今大多网站已经逐步支持HTML5。 已经快淘汰了为啥还要装Adobe Player F…- 950
- 0
-
简单弄懂 JavaScript 执行机制
不论你是javascript新手还是老鸟，不论是面试求职，还是日常开发工作，我们经常会遇到这样的情况：给定的几行代码，我们需要知道其输出内容和顺序。因为javascript是一门单线程语言，所以我们可以得出结论： javascript是按照语句出现的顺序执行的 看到这里读者要打人了：我难道不知道js是一行一行执行的？还用你说？稍安勿躁，正因为js是一行一行执行的，所以我们以为js都是这样的： le…- 667
- 0
-
H5新增的特性及语义化标签
为了更好地处理今天的互联网应用，HTML5添加了很多新元素及功能，比如: 图形的绘制，多媒体内容，更好的页面结构，更好的形式 处理，和几个api拖放元素，定位，包括网页 应用程序缓存，存储，网络工作者，等 (1)语义标签 语义化标签使得页面的内容结构化，见名知义 标签 描述 <hrader></header> 定义了文档的…- 847
- 0
-
￥优惠劵使用时效：无法使用使用时效：
之前
使用时效：永久有效优惠劵ID：×