菜鸟学习HTML5+CSS3(一)
主要内容:
1.新的文档类型声明(DTD)
2.新增的HTML5标签
3.删除的HTML标签
4.重新定义的HTML标签
一、新的文档类型声明(DTD)
HTML 5的DTD声明为:<!doctype html>、<!DOCTYPE html>、<!DOCTYPE HTML>等也是正确的,因为HTML语法是不区分大小写的。
在编写HTML5文档时,要求指定文档类型,以确保浏览器能在HTML5的标准模式下进行渲染。
二、新增的HTML5标签
HTML5 新增的标签主要分为:结构标签、多媒体标签、Web应用标签等其它标签
2.1 结构标签:(块状元素)有意义的div
<article> 标记定义一篇文章
<header> 标记定义一个页面或一个区域的头部
<nav> 标记定义导航链接
<section> 标记定义一个区域
<aside> 标记定义页面内容部分的侧边栏
<hgroup> 标记定义文件中一个区块的信息
<figure> 标记定义一组媒体内容以及它们的标题
<figcaption> 标签定义figure元素的标题
<footer> 标记定义一个页面或一个区域的底部
<dialog> 标记定义一个对话框(会话框)类似微信
新的结构标签带来的是网页布局的改变及提升对搜索引擎的友好
2.2 多媒体交互标签
<video> 标记定义一个视频
<audio> 标记定义音频内容
<source> 标记定义媒体资源
<canvas> 标记定义图片
<embed> 标记定义外部的可交互的内容或插件比如flash
HTML5的多媒体标签的出现意味着富媒体的发展以及支持不使用插件的情况下即可操作媒体文件,极大地提升了用户体验
2.3 Web应用标签
<menu> 命令列表
<menuitem> menu命令列表标签FF(嵌入系统)
<command> menu标记定义一个命令按钮
<meter> 状态标签(实时状态显示:气压、气温)C\O
<progress> 状态标签(任务过程:安装、加装)C、F、O
<datalist> 为input标记定义一个下拉列表,配合option F、O
<details> 标记定义一个元素的详细内容 ,配合dt、dd C
2.4 注释标签
<ruby> 标记定义 注释或音标
<rp> 告诉那些不支持 Ruby元素的浏览器如何去显示
<rt> 标记定义对ruby的注释内容文本
2.5 其他标签
<keygen> 标记定义表单里一个生成的键值(加密信息传送)O、F
<mark> 标记定义有标记的文本 (黄色选中状态)
<output> 标记定义一些输出类型,计算表单结果配合oninput事件
<time> 标记定义一个日期/时间 目前所有主流浏览器都不支持
三、删除的HTML标签
纯表现的元素:
basefont,big,center,font, s,strike,tt,u;
对可用性产生负面影响的元素:
frame,frameset,noframes;
产生混淆的元素:
acronym ,applet,isindex,dir。
四、重新定义的HTML标签
|
HTML元素 |
HTML5中的意义 |
|
<b> |
代表内联文本,通常是粗体,没有传递表示重要的意思 |
|
<i> |
代表内联文本,通常是斜体,没有传递表示重要的意思 |
|
<dd> |
可以同details与figure一同使用,定义包含文本,dialog也可用 |
|
<dt> |
可以同details与figure一同使用,汇总细节,dialog也可用 |
|
<hr> |
表示主题结束,而不是水平线,虽然显示相同 |
|
<menu> |
重新定义用户界面的菜单,配合commond或者menuitem使用 |
|
<small> |
表示小字体,例如打印注释或者法律条款 |
|
<strong> |
表示重要性而不是强调符号 |
整理未完~~
菜鸟学习HTML5+CSS3(一)的更多相关文章
- html5 + css3 + zepto.js实现的微信广告宣传页
最新学习html5 + css3, 参考微信的一个推广页写出一个实例巩固自己知识,自己已经将原实例打包到自己博客文件当中,但是不知道如何提供下载,如有需要的朋友可以联系我qq309666726
- HTML5 & CSS3 初学者指南(4) – Canvas使用
介绍 传统的HTML主要用于文本的创建,可以通过<img>标签插入图像,动画的实现则需要第三方插件.在这方面,传统的HTML极其缺乏满足现代网页多媒体需求的能力.HTML5的到来,带来了新 ...
- HTML5 & CSS3初学者指南(4) – Canvas使用
介绍 传统的HTML主要用于文本的创建,可以通过<img>标签插入图像,动画的实现则需要第三方插件.在这方面,传统的HTML极其缺乏满足现代网页多媒体需求的能力.HTML5的到来,带来了新 ...
- HTML5 CSS3学习
HTML5 CSS3学习 :http://www.1000zhu.com/course/css3/ HTML5 相关书籍: http://www.html5cn.com.cn/news/gdt/2 ...
- HTML5+CSS3学习笔记(二) 页面布局:HTML5新元素及其特性
HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页面显得非常简单. 本次学习HTML5的新标签元素有: <head ...
- HTML5+CSS3学习笔记(一)
HTML5+CSS3概述 HTML5和CSS3不仅仅是两项新的Web技术标准,更代表了下一代HTML和CSS技术.虽然HTML5的标准规范还没有正式发布,但是未来的发展前景已经可以预见,那就是HTML ...
- HTMl5/CSS3/Javascript 学习推荐资源
HTMl5/CSS3/Javascript 学习推荐资源 前端的定义应该是数据内容的展示,在国内大家都觉得前端只是HTML+CSS+Javascript,但是实际上与展示有关的都是前端,所以Ruby/ ...
- HTML5+CSS3学习笔记(一) 概述
HTML5+CSS3概述 HTML5和CSS3不仅仅是两项新的Web技术标准,更代表了下一代HTML和CSS技术.虽然HTML5的标准规范还没有正式发布,但是未来的发展前景已经可以预见,那就 ...
- html5 +css3 第一章学习和笔记
各位同学.身为本版的斑竹.,希望各位童鞋都能学到Html5 .特此没两天更新一个学习笔记和大家一起学习Html5.... 语法改变 1.新增的元素和废除的元素 2.新增的属性和 ...
随机推荐
- Recommender Systems 基于知识的推荐
前两章的协同过滤和就内容的推荐都建立在“大量数据”的基础上,运用概率方法来进行计算和预测.不过,在现实生活中,有些物品,如:汽车.房屋.计算机,用户不会频繁的消费.如何在这种情况下对用户进行推荐? 这 ...
- 团体程序设计天梯赛-练习集L1-020. 帅到没朋友
L1-020. 帅到没朋友 时间限制 200 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 陈越 当芸芸众生忙着在朋友圈中发照片的时候,总有一些人因为 ...
- win8系统中PL/SQL Developer连接Oracle出现的问题
注意:所有软件最后不要安装在program files (x86)下 PL/SQL Developer显示Not logged on 以管理员的身份打开PL/SQL Developer 2. t ...
- 李洪强iOS开发之【零基础学习iOS开发】【02-C语言】06-变量与内存
在前面一节中简单介绍了变量的使用,当我们定义一个变量的时候,系统就会为变量分配一块存储空间.而变量的数值在内存中是以二进制的形式存储的,这讲来深入研究变量在内存中的一些存储细节. 一.字节和地址 为了 ...
- P137、面试题23:从上往下打印二叉树
题目:从上往下打印出二叉树的每个结点,同一层的结点按照从左到右的顺序打印.例如输入如图的二叉树,则依次打印出8,6,10,5,7,9,11.(其实是按层遍历)二叉树结点的定义如下:struct Bin ...
- Java SE7新特性之try-with-resources语句
try-with-resources语句是一个声明一个或多个资源的 try 语句.一个资源作为一个对象,必须在程序结束之后随之关闭. try-with-resources语句确保在语句的最后每个 ...
- python的常用概念
常用的概念 主体字符串 主体列表 内置函数和方法的区别 映射表 引用 迭代器: 1. 字典:单步遍历迭代器 2. 文件:逐行读取的迭代器
- 1613. For Fans of Statistics(STL)
1613 高端的东西 lower_bounder 函数lower_bound()在first和last中的前闭后开区间进行二分查找,返回大于或等于val的第一个元素位置.如果所有元素都小于val,则返 ...
- poj 3007 Organize Your Train part II(二叉排序树)
题目:http://poj.org/problem?id=3007 题意:按照图示的改变字符串,问有多少种..字符串.. 思路:分几种排序的方法,,刚开始用map 超时(map效率不高啊..),后来搜 ...
- bzoj2245
这道题还是比较简单的费用流,由于w是递增的 实际上,这题数据还可以强一点,比如说分段函数不保证费用递增, 就要加一点技巧了(要保证函数的顺序) ; type node=record ne ...