1.<div>和<span>标签：

<div>和<span>标签：就像是一个空的容器，我们要往里面填充内容。一个div就是一个块，意味着它的前后都要空一行；而span则呈嵌套模式，成为一个段落的一部分。<div>标签标示任何不连续的内容块，像一个段落或者标题。<span>标签用于行内元素，出现在一个更大的段落或标题中的文字或者短语。布局如：

<div id=”footer”>

<p>Copyright 2006,<span class=”bizName”> CosmoFarmer.com</span></p>

<p>Call customer service at 555-555-5501 for more information</p>

</div>

2.常用于网页结构的标签：

·<section>标签中包含一组相关的内容，就像一本书中的章节一样。

·<aside>标签中包含与其周边的内容相关的内容，如杂志上的侧边栏一样。

·<footer>标签中包含通常放在页面底部的一些信息。如版权声明、法律信息、一些网站的导航链接等等。

·<nav>元素用来包含重要的导航链接。

·<figure>标签用于说明图。可以把<img>标签放在其中。H5还有一个新标签<figcaption>，它用来显示图片的说明文字。

3.如何让IE8及更早的版本支持HTML5的标签？

在</head>标签之前放置以下代码：

<!--[if lt IE 9]>

<script src=”//html5shiv.goolecode.com/svn/trunk/html5.js”></script>

<![endif]-->

这段代码使用了一条被称作“IE条件注释（IECC）”的东西，嵌入了一些只有IE9之前的版本可见的JavaScript代码，其他浏览器会自动忽略它。

4.注意事项：

（1）不要用<font>来控制文本的显示。

（2）不要用<b>和<i>来使文字变成粗体和斜体。如果需要强调某一个字或者短语可以使用<strong>标签将文本显示为粗体，对于次要的文字可以利用<em>标签进行强调（浏览器会将该标签内容显示为斜体）。

（3）不要用<table>标签进行网页布局。它仅仅用于显示表格式的信息，如电子数据表、进度表和图表等。

（4）不要使用仅能装饰内容外观的笨拙的<body>标签属性。

（5）不要滥用<br>标签。

5.如果还不能确定怎样用HTML来创建完善的网页， 那么可以参考以下小技巧：

（1）用标题表示文本的相对重要性。当两个标题对于网页的主题同样重要时，那就给这两个标题使用相同等级的标题；如果有一个标题不太重要，或者它是另一个标题的子标题就给它使用下一级的标题。一般来说，最好按顺序使用标题，尽量不跳号。

（2）对文本段落使用<p>标签。

（3）对于包含多个相关项目的列表，则使用无序列表（<ul>），比如导航链接、标题，或者诸如此类的一组提示语。

（4）使用有序列表（<ol>）来表示一个过程的步骤，或者定义一组项目的顺序。本书教程就是一个好范例，如“最受僧侣欢迎的十大网站”这类排名也是不错的例子。

（5）如果要创建一个术语表及其定义或描述，则要用<dl>（定义列表标签），并结合使用<dt>（定义术语）及<dd>（定义描述）标签。

（6）如果要包含一段引用语，就要尽量对长段落使用<blockquote>标签，对简短的引语则使用<q>标签。

（7）利用一些生僻的标签如<cite>来引用书的标题、新闻报道或网站。用<address>标签来标识和提供该网页作者的联系信息。

（8）绝对不要使用任何仅用于改变文本或图片展示的标签或属性，因为CSS完全可以轻松实现。

（9）如果没有适当的HTML标签，却又必须标识网页上的某一个元素或某一组元素，以获得与众不同的展现效果时，可以使用<div>和<span>标签。

（10）不要滥用<div>标签。对于导航栏可以使用HTML5的<nav>标签。

（11）要记得关闭标签。

（12）用W3C检验器来检测网页。

6.doctype（文档类型）的重要性。

HTML遵循一定的规则，这些规则都包含字一个文档类型定义文件中，也称作DTD。每一个HTML版本都有一个对应的DTD。文档类型声明告诉浏览器正在使用的HTML版本，让浏览器显示正确网页。

HTML5的文档类型很简单：

<!doctype html>

CSS3秘笈：第一章的更多相关文章

  1. CSS3秘笈复习：第一章&第二章&第三章

    第一章: 1.<cite>标签不仅可以将网页设置为斜体,还能给标题做上标记,使它便于被搜索引擎搜索到. 第二章: 1.import指令链接样式表: CSS本身有一种添加外部样式的方法:@i ...

  2. CSS3秘笈第三版涵盖HTML5学习笔记9~12章

    第9章,装饰网站导航 限制访问,处于隐私方面考虑,浏览器已经开始限制可以对伪类:visited应用哪些CSS属性了.其中包括对已访问过的链接定义color.background-color.borde ...

  3. CSS3秘笈第三版涵盖HTML5学习笔记6~8章

    第二部分----CSS实用技术 第6章,文本格式化 指定备用字体: font-family:Arial,Helvetica,sans-serif; 当访问者没有安装第一种字体时,浏览器会在列表中继续往 ...

  4. CSS3秘笈第三版涵盖HTML5学习笔记1~5章

    第一部分----CSS基础知识 第1章,CSS需要的HTML HTML越简单,对搜索引擎越友好 div是块级元素,span是行内元素 <section>标签包含一组相关的内容,就像一本书中 ...

  5. CSS3秘笈第三版涵盖HTML5学习笔记13~17章

    第13章,构建基于浮动的布局 使用的是float(浮动)属性 注:float:none值将取消所有浮动,通常只用来取消元素中已经应用的浮动. 切记:不需要给正文的div设计宽度,即使设计成固定宽度也不 ...

  6. CSS3秘笈复习：第九章&第十章

    第九章 1.和链接有关的伪类: (1):link,未访问过的链接 (2):visited,已访问过的链接 (3):hover,鼠标悬停链接 (4):active,单击链接时 这四种方式一定要严格按上面 ...

  7. CSS3秘笈：第七章

    第七章  margin.padding和border 1.盒模型:四个属性: (1)padding:内容与其边框线之间的空间. (2)border:盒子周围的直线 (3)background-colo ...

  8. CSS3秘笈：第六章

    第六章  文本格式化 1.font-family 属性设置字体.除了指定想要的字体之外还要使用备用字体.例如: p{ font-family:Arial ,Helvetica ,sans-serif; ...

  9. CSS3秘笈复习：十三章&十四章&十五章&十六章&十七章

    第十三章 1.在使用浮动时,源代码的顺序非常重要.浮动元素的HTML必须处在要包围它的元素的HTML之前. 2.清楚浮动: (1).在外围div的底部添加一个清除元素:clear属性可以防止元素包围浮 ...

随机推荐

  1. 对比git pull和git pull --rebase

    1.使用下面的关系区别这两个操作:git pull = git fetch + git mergegit pull --rebase = git fetch + git rebase 2 一.基本 g ...

  2. python基础---pymsql

    pymsql是Python中操作MySQL的模块,其使用方法和MySQLdb几乎相同. 一.下载安装 pip3 install pymysql 二.使用 1.执行SQL #!/usr/bin/env ...

  3. JAVA 并发编程关键点

    上下文切换 死锁 volatile synchronized 原子操作 happens-before as-if serial 锁的内存 final 线程:daemon start suspend r ...

  4. nagios监控mysql主从状态

    看了网上很多mysql主从监控的,大部分都是shell的,就算是python的,也是在python下跑shell语句.我写了一个python的监控脚本,用到了mysqldb这个包.脚本如下: [roo ...

  5. 写了一下午的dijkstra。突然发现我写的根本不是dijkstra。。。。是没优化过的BFS.......

    写了一下午的dijkstra.突然发现我写的根本不是dijkstra....是没优化过的BFS.......

  6. 第六十一节，html超链接和路径

    html超链接和路径 学习要点:     1.超链接的属性     2.相对与绝对路径     3.锚点设置                              本章主要探讨HTML5中文本元素 ...

  7. 第五十九节，模拟浏览器请求Python结合html基本格式

    模拟浏览器请求Python结合html基本格式 用Python模拟一个客户端,结合打开一个HTML页面 创建客户端 #!/usr/bin/env python # -*- coding:utf8 -* ...

  8. PAT 团体程序设计天梯赛-练习集 L1-020. 帅到没朋友

    原题  https://www.patest.cn/contests/gplt/L1-020 当芸芸众生忙着在朋友圈中发照片的时候,总有一些人因为太帅而没有朋友.本题就要求你找出那些帅到没有朋友的人. ...

  9. mysql创建用户、授权[转]

    一, 创建用户: 命令:CREATE USER 'username'@'host' IDENTIFIED BY 'password'; 说明:username - 你将创建的用户名, host - 指 ...

  10. 【瞎搞搞之】 window_x64微信小程序环境搭建

    所需文件地址如下: http://pan.baidu.com/s/1nv0IHhn(ylk7)   1.下载微信开发工具0.7.0_x64 安装完成后,打开程序,进行微信扫码登录 2.下载微信开发工具 ...