<meta name="viewport" content="height=[pixel_value | device-height], width=[pixel_value | device-width], inital-scale=float_value, minimum-scale=float_value, maximum-scale=float_value, user-scalable=[yes|no], target-densitydpi=[dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi]" />width:控制 viewport的大小,可以指定一个值或者特殊的值,如 device-width为设备的宽度(单位为缩放为 100%时的 css 的...
(注:本笔记是本人在菜鸟教程网站https://www.runoob.com/bootstrap学习时所做的记录)一、Bootstrap介绍Bootstrap,来自 Twitter,是目前最受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷。二、Bootstrap包的内容基本结构:Bootstrap 提供了一个带有网格系统、链接样式、背景的基本结构。这将在 Bootstrap 基本结构 部分详细讲解。CSS:Bootstrap 自带以下特性:全局的 CSS 设...
<!DOCTYPE html><html><head><meta charset="utf-8"><title>访问计数</title></head><body><div id="counter_div"></div></body></html><script type="text/javascript"> // 递增localStorage计数 if (localStorage.counter == null) { localStorage.counter = 1; } else { localStorage.counter++; } // 显示计数 var counter_div = document.getElementById("counter_div"); counter_div.innerHTML = localStorage...
<article>标签定义外部的内容(结构元素)<section>标签定义文档中的节(section,区段)。比如章节,页眉,页脚或文档中的其他部分(结构元素)<nav>引导和导航内容链接<aside>定义页面内容之外的内容。 aside的内容与article的内容相关。(结构元素)<meter>定义预定义范围内的度量。仅用于已知最大和最小值的度量(内联元素)<progress>定义任何类型的任务的进度。可以使用<progress>标签来显示javascript中耗费时间的函数的进度...
最近看到一个粒子网格动画挺炫的,自己也就做了一个,当背景挺不错的。CSDN不能上传超过2M的图片,所以就简单截了一个静态图片:可以点击这里查看动画.下面就开始说怎么实现这个效果吧: 首先当然是添加一个canvas了:<canvasid="canvas"></canvas>下面是样式:<style>#canvas{position: absolute;display: block;left:0;top:0;background:#0f0f0f;z-index: -1;}</style>上面canvas的z-index: -1的作用是可以放在一些元素的下面当...
浏览器支持Internet Explorer 9+、Firefox、Opera 12、Chrome 以及 Safari 5 支持拖放。注释:在 Safari 5.1.2 中不支持拖放。HTML5 拖放实例下面的例子是一个简单的拖放实例:实例<!DOCTYPE HTML> <html> <head> <script type="text/javascript"> function allowDrop(ev) { ev.preventDefault(); }function drag(ev) { ev.dataTransfer.setData("Text",ev.target.id); }function drop(ev) { ev.preventDefault();//allowDrop(ev) ...
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用。今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理和一个基于浏览器的HTML5地理定位的小demo,获取浏览器经纬度,并用腾讯地图(大家可以选择自己喜欢的地图)显示出来,实现的最终效果如下图所示:一、检测浏览器是否支持: if (navigator.geolocation) { //console.log("浏览器支持!"); }else {...
1元素指的是从开始标签到结束标签的所有代码<br/>换行,但是换行的间距跟p标签的间距不同空元素在开始标签中进行关闭大多数的html元素可拥有属性大多数的html元素都是可以嵌套的 html属性:1标签可以拥有属性为元素提供更多的信息2属性以键值对的形式出现3常用标签属性:<h1>:align对其方式<body>:bgcolor背景颜色<a>:target规定在何处打开链接(新的页面,默认的是当前页面,一共是4个)4通用属性:class:规定元素的类名id:规定元...
本地数据持久性提高了 Web 应用程序可访问性和移动应用程序响应能力索引数据库 (IndexedDB) API(作为 HTML5 的一部分)对创建具有丰富本地存储数据的数据密集型的离线 HTML5 Web 应用程序很有用。同时它还有助于本地缓存数据,使传统在线 Web 应用程序(比如移动 Web 应用程序)能够更快地运行和响应。本文将介绍如何管理 IndexedDB 数据库。 HTML5 的一个重要特性是本地数据持久性,它使用户能够在线和离线访问 Web 应用程序。此...
一、indexedDB为何替代了Web SQL Database?跟小朋友的教育从来没有什么“赢在起跑线”这种说法一样,在前端领域,也不是哪来先出来哪个就在日后引领风骚的。HTML5 indexedDB和Web SQL Database都是本地数据库数据存储,Web SQL Database数据库要出来的更早,然并卵。从2010年11月18日W3C宣布舍弃Web SQL database草案开始,就已经注定Web SQL Database数据库是明日黄花。未来一定是indexedDB的,从目前浏览器的兼容性来看,也表明...
如果你使用jQuery类库,那么你可以非常愉悦的使用jquery的data()方法存取data-* 自定义属性,方法允许我们在DOM元素上绑定任意类型的数据,避免了循环引用的内存泄漏风险主要的方法如下:复制代码代码如下:.data( key, value ).data( obj ).data( key ).data()从jQuery 1.4.3起, HTML 5 data- 属性 将自动被引用到jQuery的数据对象中。例如HTML:复制代码代码如下:<div data-role = "page" data-last-value = "43" data-hidden = "...
获取checkbox是否选中:$("#checkbox").is(":checked");获得的值为true或false。 设置checkbox是否选中:$("#checkbox").attr("checked", true);//设置为选中状态 $("#checkbox").attr("checked", false);//设置为未选中状态 原文:https://www.cnblogs.com/lhlong/p/11253536.html
随着 Retina 屏幕的逐渐普及,网页中对图片的适配要求也越来越高。如何让图片在放大了两倍的 Retina 屏幕显示依然清晰,曾经一度困扰着网页开发者,好在CSS3 与 HTML5 已经着力在改变这种现状。那么到底什么是响应式图片呢? 什么是响应式图片? 响应式图片是指:用户代理根据输出设备的分辨率不同加载不同类型的图片,不会造成带宽的浪费。同时,在改变输出设备类型或分辨率时,能及时加载对应类型的图片。UI前端框架最新力作!有...
Build Your First Website 装一个subline text HTML default rule tags with opening and closing 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>Jennifer‘s first website</title> 5 </head> 6 <body> 7 Hello world !!!! 8 </body> 9 </html> DEVELOPER FUNDAMENTALS:IIIdoctype says, hey just a heads up a file is going to use HTML5The senior developers get good salaries and good jobs are the ones ful...
<mark>、<figure>、<figcaption>、<details>、<summary>、</progress>、<ol>(新增属性)<!DOCTYPE html><html><head><meta charset="utf-8"><title>页面增强元素</title></head><body><!--mark元素,高亮或标记--><p>纪念中国人民<mark>抗日</mark>战争暨世界反法西斯战争胜利70周年阅兵式(简称9·3阅兵,或者抗战胜利日大阅兵),是中国政府为纪念中国人民抗日战争暨世界反法西斯战争胜利70周年而开展的众多纪念活动中的一项活动。...