认识<q>元素：

　　简短的引用。

　　问：你去掉了双引号，换成了一个<q>元素，只是为了显示双引号？这样不是更复杂了吗？

　　答：不。在增加<q>元素之前，浏览器只知道这是一个文本段落，其中包含一些双引号字符。而现在，由于我们使用了<q>元素，浏览器知道了这些文字是真正的引用。那又如何呢？嗯，既然浏览器知道这是一个引用，它就能用最合适的方式来显示。有些浏览器会在文本两边显示双引号，有些则不会，另外如果浏览器使用非英语语言，可能还会使用其他方法。在其他情况下如搜索引擎可能要搜索包含引用的网页。页面中增加结构和含义绝对是有意义的。

　　    最重要的一个原因是，你可以对引用设置样式，使它的外观如你所愿

<blockquote>

　　长引用。

　　创建单独的一个文本块，还把文字稍稍缩进。。

实际上就像一个新段落

　　可以嵌套

<q>和<blockquote>迷案的真相

　　<blockquote>和<q>实际上是两类不同的元素。<blockquote>元素是一个块<block>元素，而<q>元素是一个内联（inline）元素。有什么区别吗？块元素显示时就好像前后各有一个换行，而内联元素在页面文本流中总会在“行内”出现。

　　块元素：特立独行------例如<h1>..<p>  <blockquote>

　　内联元素：随波逐流------例如<q> <a> <em>

　　块元素通常用作Web页面中的主要构建模块，而内联元素往往用来标记小段内容。设计一个页面时，一般先从较大的块开始，然后在完善页面时再加入内联元素。

<br>没有任何内容，甚至还没有结束标记，它算是一个元素么？

　　的确，它没有内容。我们使用简写来表示这个元素。之所以用简写不是因为懒惰，更多的是为了提高效率。

　　<br>并不是唯一没有实际内容的元素，还有很多类似这样的元素，我们把这些元素叫做“void”元素。例如<img>元素也是void元素（vodi意思是“无值”）

　　世界上有两类元素：正常元素和void元素

两步轻松构件HTML列表

　　第一步：将每个列表项放在一个<li>元素中

　　第二部：用<ol>或<ul>元素包围列表项

　　unordered list=ul

　　ordered list=ol

　　list item=li

　　问：<ol>和<li>总要一起使用吗？

　　答：对。列表实际上就是一组列表项：<li>元素用来标识每个元素，<ol>元素把它们归为一组。

　　问：能把文本或其他元素放在<ol>或<ul>元素里吗？

　　答：不行。它们设计为只包含<li>元素

字符实体

　　例1：>字符的缩写是&gt;

　　　　<字符的缩写是&lt;

　　　　假如你希望在页面中输入“The <html> element rocks.”通过使用字符实体，可以这样输入：

　　　　The &lt;html&gt; element rocks

　　例2：还有一个特殊字符需要知道，这就是&字符（与字符）。如果希望HTML内容中出现一个&，则可以使用字符实体&amp;  而不要直接使用字符&。&之所以特殊，是因为它是所有实体的第一个字符。

　　例3：版权符号是&copyright;

　　常用字符实体

　　问：我在www.w3schools.com上查看了字符实体，注意到每个实体还有一个编号。这个编号做什么用？

　　答：你可以在HTML中使用这个编号，比如&#100，也可以使用实体名，它们的作用都是一样的。

<strong>使用这个元素来标记你希望特别强调的文本

<time>这个元素告诉浏览器这个内容是一个日期或时间

<pre>希望浏览器按你输入的方式原样显示文本时，使用这个元素来指定文本的格式。

注意：

　　开始输入内容之前要规划好Web页面的结构。首先画出一个草图，然后创建一个略图，最后再写出HTML

　　规划页面时，首先设计大的块元素，然后用内联元素完善

　　记住，要尽可能使用元素来告诉浏览器你的内容的含义。

　　

第三章 Web页面建设的更多相关文章

  1. [HeadFrist-HTMLCSS学习笔记]第三章构建模块：Web页面建设

    [HeadFrist-HTMLCSS学习笔记]第三章构建模块:Web页面建设 敲黑板!! <q>元素添加短引用,<blockquote>添加长引用 在段落里添加引用就使用< ...

  2. 使用Micrisoft.net设计方案 第三章Web表示模式

    第三章Web表示模式 体系结构设计者在设计第一个作品时比较精简和干练.在第一次设计时,并清除自己做什么,因此比较小心谨慎.第二个作品是最危险的一个作品,此时他会对第一个作品做修饰和润色,以及把第一次设 ...

  3. 第三章 web设计原则：

    程序员的修炼从优秀带卓越 第三章 web设计原则:    网站的评判标准     加载的速度要快     这到底是什么东西     给我看一个例子     清清楚楚的告诉我要做什么,并且扫除障碍   ...

  4. NancyFX 第三章 Web框架

    如果使用Nancy作为一个WEB框架而言,会有什么不同?实际上很多. 在使用Nancy框架为网页添加Rest节点和路由和之前的Rest框架中是相同的,这方面没有什么需要学习的了.Nancy采用一贯的处 ...

  5. 使用Micrisoft.net设计方案 第三章Web表示模式 Web模式集群详细介绍 Observer（观察器）

    在面向对象的编程中,对象同时包含数据和行为,这两者一起表示业务域的特定方面.使用对象生成应用程序的优点之一是可以将所有数据操作封装在对象内.这样, 就使对象成为独立的单位,并增加了在其他应用程序中重用 ...

  6. Ruby on Rails Tutorial 第三章 静态页面

    1.生成静态页面 $ rails generate controller StaticPages home help    #生成主页和帮助页面的路由.控制器及静态页面 $ rails destroy ...

  7. 谷歌/微软/必应web页面免费翻译插件

    随着网络时代的日益壮大,现在我们经常需要浏览一些各种外语的网页,或者是查阅资料帮助我们解决问题.更多的时候还是头疼在语言障碍上,正所谓"它认识你,你不认识它啊."谷歌和微软两个企业 ...

  8. （转）Django学习之 第三章：动态Web页面基础

    上一章我们解释了怎样开始一个Django项目和运行Django服务器 当然了,这个站点实际上什么也没有做------除了显示了"It worked"这条信息以外. 这一章我们介绍怎 ...

  9. 精通Web Analytics 2.0 （5） 第三章：点击流分析的奇妙世界：指标

    精通Web Analytics 2.0 : 用户中心科学与在线统计艺术 第三章:点击流分析的奇妙世界:指标 新的Web Analytics 2.0心态:搞定它.新的闪亮系列工具:是的.准备好了吗?当然 ...

随机推荐

  1. Hibernate.编写xml文件无自动提示信息

    Hibernate.编写xml文件无自动提示信息 注意: 配置 xxxx.hbm.xml 文件的自动提示.和配置 hibernate.cfg.xml 文件的提示,操作步骤是一样的.只是复制的文件内容. ...

  2. python 定义函数 调用函数

    创建test.py文件 #coding=utf-8 #定义函数 def hello(): print "hello world" #调用函数 hello() 在cmd下面运行

  3. Unity shader学习之Alpha Test

    可以在fragment中使用cg的函数--clip来进行透明度测试. 函数定义如下: void clip(float4 x); void clip(float3 x); void clip(float ...

  4. JavaBean和List<JavaBean>

    2018-11-04 23:04:03开始写 返回泛型为User是列表 public List<User> getUserInfo() { conn = getConn();//获取数据库 ...

  5. SQl server更新某阶段的匹配关系。

    DECLARE @count INTEGERDECLARE @id INTEGERDECLARE @subjectID INTEGERSET @count=1SET @id =11894SET @su ...

  6. 数据模型Model(I)

    枚举.结构体和协议组成Model //定义一个协议 protocol BaseItemProtocal { var title: String { get set } //属性是可读可写的 var t ...

  7. 初探AngularJs框架（三）

    一.实现todoList的demo 功能很简单,提供一个文本框,用户输入回车后添加新条目.每个条目可以在待处理和处理中两个区域间切换,每个条目都可以被删除,大致的界面如下图所示: 二.处理逻辑 首先将 ...

  8. ztree使用实例

    一.当某节点被选择或被取消选择时获取所有被选择的节点: <link rel="stylesheet" href="./static/libs/ztree/css/m ...

  9. AtCoder Beginner Contest 087 (ABC)

    A - Buying Sweets 题目链接:https://abc087.contest.atcoder.jp/tasks/abc087_a Time limit : 2sec / Memory l ...

  10. Top 5 Reasons to Get BMW ICOM A2 with Latest Software

    Top 5 Reasons to Get BMW ICOM A2 with Latest Software 1.BMW ICOM A2 Hardware Version: V2018.03 2.Sup ...