第三章 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心态:搞定它.新的闪亮系列工具:是的.准备好了吗?当然 ...
随机推荐
- BDD 与DSL 入门
正文: Behavior Driven Development,行为驱动开发是一种敏捷软件开发的技术,它鼓励软件项目中的开发者.QA和非技术人员或商业参与者之间的协作.在了解Behavior Driv ...
- 四 js Math数学简单使用
//Math是全局的 //Math.PI 数学里的3.1415926.... console.log(Math.PI); //取随机数 //js提供的随机函数 Math.random() --> ...
- SolidWorks242个使用技巧
1 您可以使用 CTRL+TAB 键循环进入在 SolidWorks 中打开的文件. 2 使用方向键可以旋转模型.按 CTRL 键加上方向键可以移动模型.按 ALT 键加上方向键可以将模型沿顺时针或逆 ...
- hdu2295DLX重复覆盖+二分
题目是说 给了n个城市 m个雷达 你只能选择其中的k个雷达进行使用 你可以设置每个雷达的半径,最后使得所有城市都被覆盖,要求雷达的半径尽可能的小(所有雷达的半径是一样的) 二分最小半径,然后每次重新建 ...
- 【2017-2-21】C#分支语句,分支嵌套,变量的作用域
分支语句 句式:if else(必须是if开头,可以是else if或者else结束,也可以直接结束) if(bool型比较表达式) { 如果上面的条件成立,则执行这里面的代码 } else if(b ...
- 【Hadoop学习之十】MapReduce案例分析二-好友推荐
环境 虚拟机:VMware 10 Linux版本:CentOS-6.5-x86_64 客户端:Xshell4 FTP:Xftp4 jdk8 hadoop-3.1.1 最应该推荐的好友TopN,如何排名 ...
- 【Hadoop学习之四】HDFS HA搭建(QJM)
环境 虚拟机:VMware 10 Linux版本:CentOS-6.5-x86_64 客户端:Xshell4 FTP:Xftp4 jdk8 hadoop-3.1.1 由于NameNode对于整个HDF ...
- 设计模式之State(状态)(转)
State的定义: 不同的状态,不同的行为;或者说,每个状态有着相应的行为. 何时使用? State模式在实际使用中比较多,适合"状态的切换".因为我们经常会使用If elseif ...
- Sqoop与HDFS、Hive、Hbase等系统的数据同步操作
Sqoop与HDFS结合 下面我们结合 HDFS,介绍 Sqoop 从关系型数据库的导入和导出. Sqoop import 它的功能是将数据从关系型数据库导入 HDFS 中,其流程图如下所示. 我们来 ...
- c# ref和out参数
向方法传递参的时候,对应的参数通常会用实参的拷贝来初始化.就是说随便在方法内部进行怎样的修改,都不会影响作为参数传递的变量的原始值. 通过上面的例子我们可以看出来,如果一个方法的参数是引用类型,那么使 ...