![](https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
html5
文章平均质量分 75
老虎帅呆了
我愿像鱼痴情海洋一样,像鸟迷恋天空一般对待自己的人生。
展开
-
uniapp和5+app适配苹果iOS13暗黑模式教程
iOS13开始苹果引入了暗黑模式(DarkMode),在黑暗模式下,系统界面配色都会相应变暗,同时App也需要进行适配。HBuilderX2.6.3+版本开始支持对暗黑模式的适配处理。全局开启暗黑模式为了保证应用的兼容性,HBuilderX打包生成的App默认已关闭兼容暗黑模式,需按以下方法配置开启暗黑模式。如果不开启黑暗模式,将无法获取当前系统的外观模式打开项目的manifest.j...原创 2020-03-14 17:53:30 · 5412 阅读 · 1 评论 -
HTMl5的存储方式sessionStorage和localStorage详解
html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage。sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁因此sessionStorage不是一种持久化的本地存储,仅仅是会话级别的存储。而localStorage用于持久化的本地存储,除非主动删原创 2016-07-21 11:49:44 · 354 阅读 · 0 评论 -
【单页应用巨坑之History】细数History带给单页应用的噩梦
前言在我们日常的网页浏览中,我们非常喜欢做一个操作:点击浏览器的前进后退在Ajax技术出现后,有些时候前进后退就会给开发者带来困扰,甚至一些开发者试图去干掉History随着Html5的发展,移动端的兴旺,单页应用出现了,于是History的处理被不得不提上议程了!要知道,这一直是一项让人不愿意去碰的巨坑,但是单页应用却不得不去解决首先History的处理逻辑看似简单,原创 2016-08-16 15:49:40 · 1424 阅读 · 0 评论 -
JS实现各种复制到剪贴板
一、实现点击按钮,复制文本框中的的内容 script type="text/javascript">function copyUrl2(){var Url2=document.getElementById("biao1");Url2.select(); // 选择对象docum原创 2016-10-13 19:25:21 · 31113 阅读 · 5 评论 -
HTML 5 video 视频标签全属性详解
现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Theora或者VP8(如果这玩意儿没出事的话)的(Opera、Mozilla、Chrome),支持H.264的(Safari、IE 9、Chrome),都不支持的(IE6、7、8)。好吧,现在让我们从技术层面来认识HTML 5的视频,包括video标签的使用,视频对象可以用到的媒介属性和方法,以及媒介事件。Video标签原创 2016-10-24 17:50:51 · 655 阅读 · 0 评论 -
几种不同格式的json解析
给服务端发送请求后,服务端会返回一连串的数据,这些数据在大部分情况下都是XML格式或者JSON格式。然后JSON相对XML来说解析相对方便一些,所以先说说JSON的解析。JSON的基本数据格式有这几种:1.一个JSON对象——JSONObject{"name":"胡小威" , "age":20 , "male":true}2.一个JSON数组——JSONArray转载 2016-10-20 11:08:33 · 14361 阅读 · 1 评论 -
android 中 webview 怎么用 localStorage?
我在 android里面 使用html5的 localStorage 为什么存不进去也读不出来呀?网上搜了好多都没效果 123456789mainWebView = (WebView)this.findViewById(R.id.mainWebView);转载 2016-10-20 13:23:25 · 757 阅读 · 0 评论 -
html5 localStorage实现表单本地存储
进入正题了,项目中有许多表单输入框要填写,还有一些单选复选框之类的.用户可能在填写了大量的信息之后,不小心刷新了页面或者出现了什么异常,导致页面上填写的信息消失了.还得重新填写信息,麻烦至极. html5推出了本地存储的功能,localStorage以及sessionStorage.我打算利用他们来实现一个临时存储的功能,即使页面刷新,数据依然保留. 1.页面初始如下:原创 2016-10-08 16:42:45 · 7916 阅读 · 2 评论 -
使用 HTML5 WebSocket 构建实时 Web 应用
HTML5 WebSocket 简介和实战演练本文主要介绍了 HTML5 WebSocket 的原理以及它给实时 Web 开发带来的革命性的创新,并通过一个 WebSocket 服务器和客户端的案例来充分展示 WebSocket 的强大和易用。作为下一代的 Web 标准,HTML5 拥有许多引人注目的新特性,如 Canvas、本地存储、多媒体编程接口、Web转载 2016-12-06 17:50:23 · 584 阅读 · 0 评论 -
使用Node.js+Socket.IO搭建WebSocket实时应用
Web领域的实时推送技术,也被称作Realtime技术。这种技术要达到的目的是让用户不需要刷新浏览器就可以获得实时更新。它有着广泛的应用场景,比如在线聊天室、在线客服系统、评论系统、WebIM等。WebSocket简介谈到Web实时推送,就不得不说WebSocket。在WebSocket出现之前,很多网站为了实现实时推送技术,通常采用的方案是轮询(Polling)和Comet技术,Co...原创 2016-12-10 21:09:29 · 830 阅读 · 0 评论 -
table固定表头和首列
table固定表头和首列html部分,结构上分为左右两部分,又分别拆开为上下两部分,总共四个结构部分,以下为固定首行和首列,需要固定多行多列的可以自行添加,如下列表中姓名为左上角固定不变的位置,可自行添加多个。<div class="container"> <div id="left_div"> ***<!--左上角固定不变的位置-->*** <div id=原创 2018-01-02 11:11:24 · 14132 阅读 · 4 评论 -
html5+实现一键分享多张图片到朋友圈
示例图 代码部分&lt;!DOCTYPE HTML&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset=&quot;utf-8&quot;/&gt; &lt;meta name=&quot;viewport&quot;原创 2018-11-24 11:12:45 · 4176 阅读 · 12 评论 -
小知识点总结
免费HTTPS证书生成https://freessl.org/常用命令:查看9000端口的使用情况 netstat -ant |grep 9000 结束进程: sudo pkill -9 php-fpm sudo pkill -9 php-cgi重启fpm: sudo /usr/sbin/php-fpm –daemonize 切换php...原创 2018-12-25 19:49:21 · 1923 阅读 · 0 评论 -
css3动画简介以及动画库animate.css的使用
在这个年代,你要是不懂一点点css3的知识,你都不好意思说你是个美工。美你妹啊,请叫我前端工程师好不好。呃。。好吧,攻城尸。。。呵呵,作为一个攻城尸,没有点高端大气上档次的东西怎么能行呢,那么css3的动画就绝对是值得你拥有了,虽说IE9以及更早版本的IE浏览器都不支持css3动画,但是IE6-8浏览器已是江河日下,使用谷歌浏览器、火狐浏览器、IE10+浏览器以及移动端浏览器等这些支持css3动画原创 2016-07-21 10:17:37 · 2056 阅读 · 0 评论 -
性能更好的js动画实现方式——requestAnimationFrame
用js来实现动画,我们一般是借助setTimeout或setInterval这两个函数,css3动画出来后,我们又可以使用css3来实现动画了,而且性能和流畅度也得到了很大的提升。但是css3动画还是有不少局限性,比如不是所有属性都能参与动画、动画缓动效果太少、无法完全控制动画过程等等。所以有的时候我们还是不得不使用setTimeout或setInterval的方式来实现动画,可是setTimeo原创 2016-07-21 10:13:52 · 4186 阅读 · 0 评论 -
github 上常用的两种工作模式
文章开始前我觉得有必要稍微介绍下GIT. Git --- The stupid content tracker, 傻瓜内容跟踪器。那么怎么理解呢?git首先是一个版本控制工具,这点和常用CVS, Subversion是一样的,而不同的是,他采用分布式版本控制库的方式管理。Git的速度非常快,可以很轻易创建分支,并且非常适合用于大项目,它有着非常出色的代码合并追踪能力,再同时它有很多小工具帮它管原创 2016-07-31 10:38:34 · 894 阅读 · 0 评论 -
Javascript模块化编程(一):模块的写法
随着网站逐渐变成"互联网应用程序",嵌入网页的Javascript代码越来越庞大,越来越复杂。网页越来越像桌面程序,需要一个团队分工协作、进度管理、单元测试等等......开发者不得不使用软件工程的方法,管理网页的业务逻辑。Javascript模块化编程,已经成为一个迫切的需求。理想情况下,开发者只需要实现核心的业务逻辑,其他都可以加载别人已经写好的模块。但是,Ja原创 2016-07-25 08:59:10 · 212 阅读 · 0 评论 -
Flex 布局教程:语法篇
一、Flex布局是什么?Flex是Flexible Box的缩写,意为"弹性布局",用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为Flex布局。.box{ display: flex;}行内元素也可以使用Flex布局。.box{ display: inline-flex;}Webkit内核的浏览器,必须加上-we原创 2016-07-14 14:31:53 · 1895 阅读 · 0 评论 -
Flex 布局教程:实例篇
一、骰子的布局骰子的一面,最多可以放置9个点。下面,就来看看Flex如何实现,从1个点到9个点的布局。你可以到codepen查看Demo。如果不加说明,本节的HTML模板一律如下。div class="box"> span class="item">span>div>上面代码中,div元素(代表骰子的一个面)是Flex容器,sp原创 2016-07-14 14:34:12 · 1888 阅读 · 0 评论 -
手机端html5触屏事件(touch事件)
touchstart:触摸开始的时候触发touchmove:手指在屏幕上滑动的时候触发touchend:触摸结束的时候触发而每个触摸事件都包括了三个触摸列表,每个列表里包含了对应的一系列触摸点(用来实现多点触控):touches:当前位于屏幕上的所有手指的列表。targetTouches:位于当前DOM元素上手指的列表。changedTouches:原创 2016-07-25 22:34:23 · 12472 阅读 · 0 评论 -
20分钟打造你的Bootstrap站点
基本的HTML模板我们需要以一个基本的HTML模板,这样我们能够把所需要的bootstrap文件包含进来。下面就是我们twitter bootstrap项目的开头,复制这些代码到一个文件中并将其命名为index.html。 head> title>Twitter Bootstrap Tutorial - A responsive layout tutoria原创 2016-07-26 15:24:39 · 1569 阅读 · 0 评论 -
前端的图片优化的6种方案
前端的图片优化的6种方案 1、使用base64编码代替图片场景:适用于图片大小小于2KB,页面上引用图片总数不多的情况 原理:将图片转换为base64编码字符串inline到页面或css中 优势:减少http的请求次数,并可以放到后台数据库中,只传输字符串,有较多的构建工具可以直接实现劣势:这种方法仅限于图片总数较少,而且图片大小小于2KB的情况。否则图片字符串会变得很长很长2原创 2016-06-20 09:28:24 · 5189 阅读 · 0 评论 -
关于响应式布局的一点理解
随着互联网的快速发展,以及html5+css3的迅速崛起。渐渐的响应式布局,也会慢慢的出现在我们的视野里,身为专业的web前端人员,还不学习新技术你就out啦!为什么这样说呢?因为响应式布局能同时兼容多个终端,比如(手机、平板、PC)做一个网站转眼间就可以变成3个网站,和现在相比是不是更加具有优势呢!可能有些人对“什么是响应式布局”还不是很了解,下面就跟大家简单说下什么是响应式布局:原创 2016-07-16 23:56:43 · 3431 阅读 · 0 评论 -
WebApp开发之--"rem"单位
随着web app的兴起,rem这是个低调的css单位,近一两年开始崭露头角,有许多朋友对于它的评价不一,有的在尝试使用,有的在使用过程中遇到坑就弃用了。但是我认为rem是用来做web app它绝对是最合适的人选之一。一、rem是什么?rem(font size of the root element)是指相对于根元素的字体大小的单位。简单的说它就是一个相对单位。看到rem原创 2016-07-16 23:59:20 · 607 阅读 · 0 评论 -
js实现 无缝切换 效果
总共9张图,同时显示三张图,通过复制添加和删除节点的操作实现无缝切换效果,无限循环原创 2016-07-15 09:30:38 · 1847 阅读 · 0 评论 -
移动端开 发需要注意的一些事情
不知不觉,做移动端开发也有半年的时间了。从刚开始接触移动端开发,到现在的细节完善。期间也走了很多坑!为什么会走这么多坑呢?可能身边做前端开发的朋友比较少,想找个人一起研究技术的都没。也加过一些前端群,大多数些扯淡聊天的群。没办法,只得自己去苦逼的研究!下面一起来分享下,我做移动端开发半年来的一些经验,以及需要注意的一些东西吧!一、关于单位的使用相信只要做原创 2016-07-17 00:08:10 · 350 阅读 · 0 评论 -
H5基于iScroll实现下拉刷新,上拉加载更多
前言 前一段有个手机端的项目需要用到下拉刷新和上拉加载更多的效果,脑海里第一反映就是微博那种效果,刚开始的理解有些偏差,以为下拉也是追加数据,上拉也是追加数据,后请教同事后发现其实下拉只是刷新最新数据而已,上拉是追加数据。 使用技巧 1、引用iScroll.js, 在初始化时添加两个事件监听:touchMove、DOMContentLoaded。原创 2016-07-29 08:50:10 · 1999 阅读 · 0 评论 -
多行文本溢出显示省略号(…)全攻略
掘金是一个高质量的技术社区,从 ECMAScript 6 到 Vue.js,性能优化到开源类库,让你不错过前端开发的每一个技术干货。各大应用市场搜索「掘金」即可下载APP,技术干货尽在掌握..大家应该都知道用text-overflow:ellipsis属性来实现单行文本的溢出显示省略号(…)。当然部分浏览器还需要加宽度width属性。overflow: hidden;text-原创 2016-07-29 12:56:45 · 5175 阅读 · 0 评论 -
用canvas画了个钟表,来玩玩吧
canvas2d动画 #can1{border: 1px solid #ccc;} 用canvas画圆形 var demo=document.getElementById("can1"); //设置宽高 demo.width=1000; demo.height=600; //首先要得到画布的控制权 var ctx=demo.getC原创 2016-07-23 09:59:12 · 1232 阅读 · 0 评论