学习 HTML5-页面结构(1)】的更多相关文章

我是html5初学者,最近闲来无事,和各位一起学些下html5. 开发环境 jdk1.6,tomcat6,开发工具eclipse. 新建一个web工程,创建一个index.jsp页面.页面代码如下. 一般页面设计分为头(header).体(content).尾(footer)三个部分. <!DOCTYPE html><!-- html5标识 --> <html> <head> <meta charset="UTF-8">   …
缘起 2014年10月29日,万维网联盟宣布,经过几乎8年的艰辛努力,HTML5标准规范终于最终制定完成了,并已公开发布. 而HTML5的草稿版本在13年就已经放出.作为一个有追求的程序猿这次想赶一次潮流学习一下HTML5,并作一次笔记以便日后温故. 基础 “君子务本,本立而道生.” 啥是HTTP了? 超文本传输协议(HTTP,HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议.是基于TCP的一种协议. 定义有些晦涩,大家都知道这么说,其实很多程序员如果…
本篇主要介绍HTML5增加的语义元素中关于页面结构方面的,包含: <article>.<aside>.<figure>.<figcaption>.<footer>.<header>.<main>.<nav>.<section>等元素. 目录 1. 语义元素介绍 1.1 何为语义元素 1.2 特点 2. 原先界面布局 3. 页面结构语意元素 3.1 说明 3.2 详细介绍 3.3 示例图 4. 旧版浏…
在HTML5之前,主要的容器元素是div元素,但在HTML5中提供了数种其它容器元素供我们使用. 因此,当组织Web页面结构时,首先使用HTML将内容分成多部分,然后在对其使用CSS应用样式和格式. HTML5添加了6个新的容器元素以及最初的div元素: header:用于容纳文档或部分的标题,比如:标题.副标题.标语和导航: footer:用于容纳文档或部分的页脚,比如:联系信息和版权数据: nav:用于容纳文档或部分的重要导航元素: aside:用于分组与主题无关的内容,比如:重要的引文.传…
要了解和熟悉 HTML5 中的新的语义元素,最好的方式就是拿一经典的 HTML 文档作例子,然后把 HTML5 的一些新鲜营养充实进入.如下就是我们要改造的页面,该页面很简单,只包含一篇文章. ApocalypsePage_Original.html,这是一个格式非常规范的页面,所有的样式均来自于外部样式表. <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8…
--------------------HTML5新结构标签--------------------1.h5新增的主要语义化标签如下: 1.header 页面头部.页眉 2.nav 页面导航 3.article 一篇文章 4.section 文章中的章节 5.aside 侧边栏 6.footer 页面底部.页脚 pc端兼容需要引用对应的js脚本<script type="text/javascript" src="//cdn.bootcss.com/html5shiv/…
一,开篇分析 Hi,大家好!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例, 让大家一步一步的体会"h5"能够做什么,以及在实际项目中如何去合理的运用达到使用自如,完美驾驭O(∩_∩)O~,好了,废话不多说,直接进入今天的主题, 今天主要讲的是对昨天文章中的代码进行重构,并且相应的美化了一下前台UI界面,如下图所示的效果: 哈哈哈酷吧!继续让咱们做个简单的回顾: 为了提高Web页面的响应速度,越…
一,开篇分析 Hi,大家好!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例, 让大家一步一步的体会"h5"能够做什么,以及在实际项目中如何去合理的运用达到使用自如,完美驾驭O(∩_∩)O~,好了,废话不多说,直接进入今天的主题, 今天主要讲的是“History API”及在单页应用中的作用,并且会引入一个实际的例子做为讲解的原型范例,先来看看“History API”: 为了提高Web页面的响应…
1:文档结构元素 1.1 文章语义 --  article.header和footer元素 article元素在页面中用来表示结构完整且独立的内容部分,如论坛的一个帖子,杂志或者报纸的一篇文章. article元素是可以嵌套使用的,内层的内容在原则上需要与外层内容相关联.例如,一篇博客文章与针对该文章的评论一起可以使用嵌套article的方式,这时 用来呈现评论的article元素被包含在文章内容的article里面. header元素是一种具有引导和导航作用的辅助元素,通常,header元素可…
很多的人在毕业之后才发现原来学的专业不是自己想做的工作,或者专业对口的工作待遇让人觉得并不满意,于是很多人选择培训机构学新的一门技能转换行业.IT行业的web前端H5受到很多学员的青睐.那么学习web前端H5是怎么样的一种体验呢? 千锋长沙的一名学员这么说:时间匆匆流逝,转眼间HTML5培训第一阶段的学习就宣告结束了,脑中回想起刚来这里的时候每天的日程十分不适应,在逐渐的适应下,感觉也没有什么,每天该学习的时候去学习,该放松的时候适当休息一下,有一种回到了高三的感觉,虽然可能感觉会有一点累,但是…