第三章 Web页面建设
认识<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：>字符的缩写是>
<字符的缩写是<
假如你希望在页面中输入“The <html> element rocks.”通过使用字符实体，可以这样输入：
The <html> element rocks
例2：还有一个特殊字符需要知道，这就是&字符（与字符）。如果希望HTML内容中出现一个&，则可以使用字符实体& 而不要直接使用字符&。&之所以特殊，是因为它是所有实体的第一个字符。
例3：版权符号是©right;
问：我在www.w3schools.com上查看了字符实体，注意到每个实体还有一个编号。这个编号做什么用？
答：你可以在HTML中使用这个编号，比如d，也可以使用实体名，它们的作用都是一样的。
<strong>使用这个元素来标记你希望特别强调的文本
<time>这个元素告诉浏览器这个内容是一个日期或时间
<pre>希望浏览器按你输入的方式原样显示文本时，使用这个元素来指定文本的格式。
注意：
开始输入内容之前要规划好Web页面的结构。首先画出一个草图，然后创建一个略图，最后再写出HTML
规划页面时，首先设计大的块元素，然后用内联元素完善
记住，要尽可能使用元素来告诉浏览器你的内容的含义。
第三章 Web页面建设的更多相关文章
- [HeadFrist-HTMLCSS学习笔记]第三章构建模块：Web页面建设
[HeadFrist-HTMLCSS学习笔记]第三章构建模块:Web页面建设 敲黑板!! <q>元素添加短引用,<blockquote>添加长引用 在段落里添加引用就使用< ...
- 使用Micrisoft.net设计方案 第三章Web表示模式
第三章Web表示模式 体系结构设计者在设计第一个作品时比较精简和干练.在第一次设计时,并清除自己做什么,因此比较小心谨慎.第二个作品是最危险的一个作品,此时他会对第一个作品做修饰和润色,以及把第一次设 ...
- 第三章 web设计原则：
程序员的修炼从优秀带卓越 第三章 web设计原则: 网站的评判标准 加载的速度要快 这到底是什么东西 给我看一个例子 清清楚楚的告诉我要做什么,并且扫除障碍 ...
- NancyFX 第三章 Web框架
如果使用Nancy作为一个WEB框架而言,会有什么不同?实际上很多. 在使用Nancy框架为网页添加Rest节点和路由和之前的Rest框架中是相同的,这方面没有什么需要学习的了.Nancy采用一贯的处 ...
- 使用Micrisoft.net设计方案 第三章Web表示模式 Web模式集群详细介绍 Observer（观察器）
在面向对象的编程中,对象同时包含数据和行为,这两者一起表示业务域的特定方面.使用对象生成应用程序的优点之一是可以将所有数据操作封装在对象内.这样, 就使对象成为独立的单位,并增加了在其他应用程序中重用 ...
- Ruby on Rails Tutorial 第三章 静态页面
1.生成静态页面 $ rails generate controller StaticPages home help #生成主页和帮助页面的路由.控制器及静态页面 $ rails destroy ...
- 谷歌/微软/必应web页面免费翻译插件
随着网络时代的日益壮大,现在我们经常需要浏览一些各种外语的网页,或者是查阅资料帮助我们解决问题.更多的时候还是头疼在语言障碍上,正所谓"它认识你,你不认识它啊."谷歌和微软两个企业 ...
- （转）Django学习之 第三章：动态Web页面基础
上一章我们解释了怎样开始一个Django项目和运行Django服务器 当然了,这个站点实际上什么也没有做------除了显示了"It worked"这条信息以外. 这一章我们介绍怎 ...
- 精通Web Analytics 2.0 （5） 第三章：点击流分析的奇妙世界：指标
精通Web Analytics 2.0 : 用户中心科学与在线统计艺术 第三章:点击流分析的奇妙世界:指标 新的Web Analytics 2.0心态:搞定它.新的闪亮系列工具:是的.准备好了吗?当然 ...
随机推荐
- Web界面进行用户管理
Web界面进行用户管理 添加用户 Tags:表示账号的角色 Admin:超级管理员 No access :表示没有可以访问的virtual host虚拟机(相当于数据库) ...
- linux整理
文件查看命令 cat [OPTION]... [FILE]... - E: 显示行结束符$ -n: 对显示出的每一行进行编号 -A:显示所有控制符 -b:非空行编号 -s:压缩连续的空行成一行 he ...
- UML之状态机图
状态机图 基本概念: 状态机图,UML 1.x规范中称状态图,是一个展示状态机的图. 状态机图基本上就是一个状态机中元素的投影,这也就意味着状态机图包括状态机的所有特征.状态机图显示了一个对象如何根据 ...
- Windows10上安装Keras 和 TensorFlow-GPU
安装环境: Windows 10 64bit GPU: GeForce gt 720 Python: 3.5.3 CUDA: 8 首先下载Anaconda3的Win10 64bit版,安装Python ...
- sitecore系统教程之内容创作入门
在Sitecore中,有两种编辑工具,您可以在其中创建和编辑网站上的内容: 内容编辑器 - 专为熟悉Sitecore及其包含的功能的经验丰富的内容作者而设计的应用程序. 体验编辑器 - 一种直观的编辑 ...
- sitecore系统教程之媒体库
您可以管理媒体库中的所有媒体项目,例如要嵌入网页的图像或供访问者下载的图像.媒体库包含所有媒体项目,例如图像,文档,视频和音频文件. 在媒体库中,您可以: 将所有媒体文件保存在一个位置,并将其组织在与 ...
- 导航，头部，CSS基础
1.制作自己的导航条. 2.HTML头部元素: <base> 定义了页面链接标签的默认链接地址 <style> 定义了HTML文档的样式文件 <link> 定 ...
- 【Redis学习之八】Redis集群：主从复制
环境 虚拟机:VMware 10 Linux版本:CentOS-6.5-x86_64 客户端:Xshell4 FTP:Xftp4 jdk8 redis-2.8.18 Redis集群分类: 主从复制 R ...
- 20165305 实验三 敏捷开发与XP实践
实验3-1 敏捷开发与XP实践 http://www.cnblogs.com/rocedu/p/4795776.html, Eclipse的内容替换成IDEA 参考 http://www.cnblog ...
- JAVA基础3---运算符大全
Java中的运算符有以下种类:算术运算符.关系运算符.位运算符.逻辑运算符.赋值运算符.其他的运算符 现在假设定义 int A = 10,B = 5: 一.算术运算符 运算符 描述 案例 + 等同于数 ...