首 页 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437 438 439 440 441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459 460 461 462 463 464 465 466 467 468 469 470 471 472 473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549 550 551 552 553 554 555 556 557 558 559 560 561 562 563 564 565 566 567 568 569 570 571 572 573 574 575 576 577 578 579 580 581 582 583 584 585 586 587 588 589 590 591 592 593 594 595 596 597 598 599 600 601 602 603 604 605 606 607 608 609 610 611 612 613 614 615 616 617 618 619 620 621 622 623 624 625 626 627 628 629 630 631 632 633 634 635 636 637 638 639 640 641 642 643 644 645 646 647 648 649 650 651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 690 691 692 693 694 695 696 697 698 699 700 701 702 703 704 705 706 707 708 709 710 711 712 713 714 715 716 717 718 719 720 721 722 723 724 725 726 727 728 729 730 731 732 733 尾 页

html5调用手机摄像头

发布者: superzhang | 发布时间:2017-11-25

项目中需要用到 html5调用手机摄像头,找了很多资料,大都是 js调用api ,做了几个demo测试发现根本不行, 后来恍然大悟,用html5自带的 input file="" ,纯html5,并且不涉及到js ,就可以实现。

html5调用手机摄像头

代码如下:

html5调用手机摄像头

capture表示,可以捕获到系统默认的设备,比如:camera--照相机;camcorder--摄像机;microphone--录音。

accept表示,直接打开系统文件目录。

其实html5的input:file标签还支持一个multiple属性,表示可以支持多选,如:

<option value="1">1</option>

<option value="2">2</option>

<option value="3">3</option>

<option value="4">4</option>

<option value="5">5</option>

<option value="6">6</option>

<option value="7">7</option>

</select>

</form&g

想读更多 ->

HTML5教程 - HTML5 Web 存储

发布者: superzhang | 发布时间:2017-11-25

注:小编是一个有轻微处女座情节的人,所以很多内容为了方便阅读和格式美观,我都做成了图片,上传后头条都压缩了图片质量,但是不影响大家阅读,因为可以点击放大,哇哈哈!

注:本文为系列连载文章

上一节:

HTML5教程 - HTML5 表单 2.0

HTML5 Web 存储

HTML5 引入了两种机制,类似于 HTTP 的会话 cookies,用于在客户端存储结构化数据以及克服以下缺点。

每个 HTTP 请求中都包含 Cookies,从而导致传输相同的数据减缓我们的 Web 应用程序。

每个 HTTP 请求中都包含 Cookies,从而导致发送未加密的数据到互联网上。

Cookies 只能存储有限的 4KB 数据,不足以存储所需的数据。

这两种存储方式是 session storage 和 local storage,它们将用于处理不同的情况。

几乎所有最新版的浏览器都支持 HTML5 存储,包括 IE 浏览器。

会话存储

_会话存储_

想读更多 ->

关于HTML5 浅析

发布者: superzhang | 发布时间:2017-11-25

关于HTML5 浅析前言:

作为一名Web开发者,可能你并没有对这个“H5”这个字眼投入太多的关注,但实际上它早已不知不觉进入到你的开发中,并且总有一天会让你不得不正视它,了解它并运用它

打个比方:《海贼王》中的主角路飞在“顶上战争两年前”,会在一些危急关头“不经意”地使用霸王色霸气,但对”霸气“的结构体系和具体运用都不太了解,这让他在香波地群岛等诸多重大战役中大吃苦头。此后, 他不惜花费两年时间跟随雷利修炼霸气。因为,如果不去了解这个崭新的战斗方法的话,他们在残酷的新世界一天也生存不了。

为什么学习HTML5?

咳咳, 回到主题,为什么我们要学HTML5呢?

1. 了解HTML5的囊括范围的一大好处是:当你不小心使用了一个H5的东东的时候(例如你试图通过百度找到的答案解决一个紧张的需求),你会很及时的关注它的兼容性

2. H5有些新增的特性也许你从没接触过,也感觉无需用到它。但就在不久的将来,你可能就会用到,甚至依赖于它(毕竟这就是HTML的未来)

H5中的知识点分布

在下面, 我将学习H5中的知识点分成两类:主要知识点和针对特定功能的知识点,其中对主要知识点的部分,从学习成本的角度对其进行了难度分级

(仅属个人观点!如有改进意见,欢迎讨论)

一.主要知识点

(从需求层面上来说,普及范

想读更多 ->

HTML5画图特效

发布者: superzhang | 发布时间:2017-11-25

HTML5画图特效

PS:由于无法上传文件,所以感兴趣的朋友可以搜索公众号“ITyuanshu”,回复“3”获取整套源码

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>HTML5画图特效 超酷的笔刷动画效果演示</title>

<meta name="apple-mobile-web-app-capable" content="yes" />

<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">

<meta name="apple-mobile-web-app-title" content="Color Draw">

<meta name=

想读更多 ->

HTML5教程 - HTML5 地理定位

发布者: superzhang | 发布时间:2017-11-25

注:小编是一个有轻微处女座情节的人,所以很多内容为了方便阅读和格式美观,我都做成了图片,上传后头条都压缩了图片质量,但是不影响大家阅读,因为可以点击放大,哇哈哈!

注:本文为系列连载文章

上一节:

HTML5教程 - HTML5 Web 存储

HTML5 Geolocation API 允许我们对喜欢的网站共享我们的位置。JavaScript 可以捕获到纬度和经度,还可以发送给后端服务器,然后做一些位置感知的事情,比如查找本地企业或者在地图上显示我们的位置。

当前大多数浏览器和移动设备都支持 Geolocation API。地理定位 APIs 是作为全局 navigator 对象的一个新属性工作的。可以按照如下方式创建地理定位对象:

HTML5教程 - HTML5 地理定位

地理对象是

想读更多 ->

HTML5 重重之基础

发布者: superzhang | 发布时间:2017-11-25

HTML5的发展越来越迈向成熟,很多的应用已经逐渐出现在你我日常生活中了,不只让传统网站上的互动Flash逐渐的被HTML5的技术取代,更重要的是可以透过HTML5的技术来开发跨平台的手机软件,让许多开发者感到十分兴奋!

当你开始想要学习、试图想要投入相关的开发时,由于HTML5的技术还在持续发展、进化当中,学习的资源也都比较零散,较难有一个整体的方向。在本篇文章中,笔者将会介绍HTML5的主要技术组成,并且提供一些学习资源让大家参考。

分享之前推荐下我的前端群:524262608,不管你是小白还是大牛,小编我都挺欢迎,不定期分享干货,包括我自己整理的一份2017最新的前端资料和零基础入门教程,欢迎初学和进阶中的小伙伴。

HTML5到底是什么?

一般广义而言的HTML5则包含了HTML、CSS和JavaScript三个部分,不单单只是HTML部分而已,CSS 3和JavaScript也有许多的创新,让整个网页程序功能更加缤纷。

HTML5 重重之基础

HTML5的技术组成

脱机

想读更多 ->

HTML5教程 - HTML5 属性

发布者: superzhang | 发布时间:2017-11-25

注:本文为系列连载文章

上一节:

HTML5教程 - HTML5的语法

HTML5 属性

正如 HTML5 语法中所阐述的,元素可以包含属性(attributes)给一个元素设置各种属性(properties)。

有些属性被定义为全局的,可以用在任何元素上,而其他的被定义为元素特有的。所有的属性都有一个名称和一个值,看起来如下面的示例所示。

下面是一个使用 HTML5 属性的例子,演示了如何用名为 class 的属性和值 “example” 标记一个 div 元素:

HTML5教程 - HTML5 属性

属性只能在起始标签中指定,绝对不能用在结束标签中。

HTML5 属性不区分大小写,可以全部大写或者混合使用,尽管最常见的约定是始终使用小写。

标准属

想读更多 ->

HTML5多媒体组件

发布者: superzhang | 发布时间:2017-11-25

如今的每一个网站都离不开视频,视频可以生动形象直接的展示内容,在Html时代,都是采用flash来完成的,而flash天生具有很多次缺点,加载慢,兼容性不好,成本高,最重要的是必须要使用插件才能完成播放,用户体验不好。而HTML5新增的多媒体组件video标签,有效的解决了如上的问题,今天我们来学习HTML5新增的多媒体组件视频标签。

HTML5多媒体组件

HTML5多媒体组件

多媒体组件

多媒体视频组件

在HTML5的网页中,想要添加一个视频只需使用<video>标签即可,我们先看下网页的结构:

<!DOCTYPE html>

<html>

<head>

<title>欢迎关注头条号/自学编程</title>

<style>

*{margin:0;padding:0}

</styl

想读更多 ->

HTML5学习笔记三:HTML5语法规则

发布者: superzhang | 发布时间:2017-11-25

1.标签要小写

2.属性值可加可不加””或”

3.可以省略某些标签

html body head tbody

4.可以省略某些结束标签

tr td li

例:

HTML5学习笔记三:HTML5语法规则显示效果:

HTML5学习笔记三:HTML5语法规则

5.单标签不用加结束标签

img input

6.废除的标签

font center big

7.新添加的标签

将在下一HTML5学习笔记中重点阐述。

下期预告:

HTML5学习笔记四:html5新增标签、语义特性-文档声明

Tommy say开张两天,订阅量达到了60+,收藏300+,阅读量

想读更多 ->