• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >html5 > H5与C3的新交互特性有哪些

H5与C3的新交互特性有哪些

作者:匿名 字体:[增加 减小] 来源:互联网 时间:2018-12-03

本文主要包含html5,哪些,特性等相关知识,匿名希望在学习及工作中可以帮助到您
这次给大家带来H5与C3的新交互特性有哪些,怎么使用H5与C3的新交互特性?使用H5与C3的新交互特性的注意事项有哪些,下面就是实战案例,一起来看一下。

什么是HTML5和CSS3

HTML和CSS并不难理解。HTML为构成网页的主要语言。通过这种语言,我们可以向计算机说明网页格式、内容、显示效果等等。而CSS则是专门用来控制网页显示效果的语言。这时候问题出来了,为什么我们要单独使用CSS呢,HTML不是一样可以控制Web页面的显示效果么?为了回答这个问题,我举个简单的例子:

一旦形容的事情过多,想要把事情描述清楚的时候,我们不得不重复大量的信息?页面语言也是一样,在这种情况下显得杂乱无章,非常难以理出头绪。通过将控制显示效果的语言集成到CSS里,我们不但可以保证页面语言主体部分的简洁,而且可以非常方便的复用各种语言集合。

HTML5和CSS3是HTML和CSS的最新版本,它们目前均未确定标准,但是已经公布的新特征已经让我们心动不已。

HTML5的新特新

1. 新的内容标签

HTML4中的内容标签级别相同,无法区分各部分内容。而 HTML5 中的内容标签互相独立,级别不同,搜索引擎以及统计软件等均可快速识别各部分内容。

2. 更好的表格体系

现在,你可以抛弃JavaScript或者是PHP,只通过HTML5来定义表格。你可以定义每个表格单元的输入格式,也可以定义这个单元是否是必填的等等。

3. 音频、视频API

HTML5不但允许你在网页中直接整合视频、音频,同时更提供了一套功能丰富的API用来控制媒体播放,而这些用来控制媒体播放的元素也都是可以被编辑的。因此,HTML5在视频以及音频层面上实际已经可以替代常用的flash插件了。

4.画布(Canvas) API

在网页中绘制图形一直是个大难题,我们不得不借助flash、silverlight 等插件。然而HTML5允许你直接在网页上进行绘图,甚至允许你与网页生成更多的交互,例如绘制图形、放大缩小,等等。图例是一个用HTML5制作的小游戏。

5. 地理(Geolocation) AP

HTML5提供了地理信息的应用接口 Geolocation API。通过这个API,网页可以通过IP,GPS等方式来获得用户的地理信息;同时用户也可以选择是否关闭这个功能。

6. 网页存储(Web storage) API

HTML5提供了网页存储的API,方便Web应用的离线使用。除此之外,新的API相对于cookie也有着高安全性,高效率,更大空间等优点。

7.拖拽释放(Drag and drop) API

我们可以通过HTML5的Drag and drop API来完成网页中的拖拽释放效果,避免了以往的网页在拖拽释放过程中需要不停修改元素的位置,代码繁多的弊端。

CSS3新特性

1. RGBa

CSS3的RGBa新特性允许你对每个元素进行色彩以及透明度的设置。而原来常用的opacity命令只能对元素及其子元素进行设置。

2. Multi-column layout

CSS3新供的多栏布局选择器无需 HTML 布局标签即可生成多栏布局,同时‘栏数’、‘栏宽’以及‘栏间距’都是可以定义的。

3.Round corners

圆角功能可能是CSS3提供的最实用的功能了。通过Border-radius,你可以没有任何难度的给指定的HTML元素添加圆角。并且你还可以定义圆角的大小,以及哪个角是圆角,哪个角不是圆角。

4. @font-face

当网页显示某种用户没有安装的字体时,CSS3提供的@font-face功能会自动的、默默地帮用户从网络上下载相应字体。从而让设计师更加自由的发挥,而不用考虑用户的机器是否安装了相应字体。

5. 其他特性

此外,CSS3还给我们带来了渐变、防止字符串过长溢出、多重背景以及用图片来作为元素边框等功能。

利用好CSS3,你可以更快捷的得到以往用很多插件才能得到的效果。同过使用元素本身来取代大部分图片,网页的加载速度会得到提升,这些原本是图片的内容,也可以被搜索引擎检索到。

相信看了这些案例你已经掌握了方法,更多精彩请关注微课江湖其它相关文章!

相关阅读:

H5的通用接口详细介绍

浅谈h5增强了哪些页面元素

H5怎样用绘制五角星

以上就是H5与C3的新交互特性有哪些的详细内容,更多请关注微课江湖其它相关文章!

您可能想查找下面的文章:

  • HTML5知识点总结
  • HTML5的本地存储
  • HTML5本地存储之IndexedDB
  • Html5实现文件异步上传功能
  • Html5新标签datalist实现输入框与后台数据库数据的动态匹配
  • 详解HTML5 window.postMessage与跨域
  • HTML5拖放API实现拖放排序的实例代码
  • 解决html5中video标签无法播放mp4问题的办法
  • HTML5新特性 多线程(Worker SharedWorker)
  • Html5新增标签有哪些

相关文章

  • 2018-12-03深入解析HTML5 Canvas控制图形矩阵变换的方法_html5教程技巧
  • 2017-08-06HTML5 在canvas中绘制矩形附效果图
  • 2018-12-03分享用canvas实现水流和水池动画的代码
  • 2018-12-03html5 video 移动端详解
  • 2017-08-06不可轻视HTML5!App三年内将被html5顶替彻底消失
  • 2018-12-03关于本地预览的10篇文章推荐
  • 2018-12-03利用Storage Event实现页面间通信的示例代码
  • 2018-12-03HTML5本地数据库实例详解
  • 2018-12-03html5教程画矩形代码分享
  • 2018-12-0310年来HTML5如何给Flash这只病猫盖棺的详解

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • HTML5新特性之用SVG绘制微信logo
    • 为你的html5网页添加音效示例
    • H5制作二维码扫描和解析的代码实例
    • 分享HTML5中10个经典的动画工具
    • 移动端HTML5页面端去掉input输入框的白色背景和边框(兼容Android和ios)
    • 深入解析HTML5中的Blob对象的使用_html5教程技巧
    • 使用html5+css3来实现slider切换效果告别javascript+css
    • HTML5 的百度百科词条中,有一个中间是对勾,边缘圆锯齿状图标,是什么?
    • html5中布尔属性的hidden
    • 详细介绍HTML5 5大存储方式总结

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有