HTML
学习任何一门语言,都要首先掌握它的基本格式,就像写信需要符合书信的格式要求一样。HTML标记语言也不例外,同样需要遵从一定的规范。接下来将具体讲解HTML文档的基本格式。
HTML文档的基本格式主要包括文档类型声明、根标记、
头部标记、主体标记,具体介绍如下:(1)标记
标记位于文档的最前面,用于向浏览器说明当前文档使用哪种HTML 或XHTML(可扩展超文本标记语言)标准规范,必需在开头处使用标记为所有的XHTML文档指定XHTML版本和类型,只有这样浏览器才能将该网页作为有效的XHTML文档,并按指定的文档类型进行解析。
(2)标记
标记位于 标记之后,也称为根标记,用于告知浏览器其自身是一个HTML 文档,
标记标志着HTML文档的开始,标记标志着HTML文档的结束,在它们之间的是文档的头部和主体内容。
在之后有一串代码“xmlns=""”用于声明XHTML统一的默认命名空间。
(3)
标记标记用于定义HTML文档的头部信息,也称为头部标记,紧跟在标记之后,主要用来封装其他位于文档头部的标记,例如在HTML中使用style标记时,常常定义其属性为type,相应的属性值为text/css,表示使用内嵌式的CSS样式。
多种多样的文字效果可以使网页变得更加绚丽,为此HTML提供了文本样式标记,用来控制网页中文本的字体、字号和颜色。其基本语法格式如下:
文本内容
标记常用的属性:
中显示,此时仅仅依靠HTML标记的默认显示样式已经不能满足需求了,需要使用HTML标记的属性加以设置。其基本语法格式如下:
<标记名属性1="属性值1" 属性2="属性值2" …> 内容标记名>
在上面的语法中,标记可以拥有多个属性,必须写在开始标记中,位于标记名后面。属性之间不分先后顺序,标记名与属性、属性与属性之间均以空格分开,任何标记的属性都有默认值,省略该属性则取默认值。
其中align为属性名,center为属性值,表示标题文本居中对齐,对于标题标记还可以设置文本左对齐或右对齐,对应的属性值分别为left和right。如果省略align属性,标题文本则按默认值左对齐显示。
在网页中,有时需要为文字设置粗体、斜体或下划线效果,这时就需要用到HTML中的文本格式化标记,使文字以特殊的方式显示,常用文本格式化标记如下表所示。
一个引人入胜的网页,往往包含很多图片。合理地使用图文混排,能使枯燥的网页变得丰富多彩。本节将使用“图像标记”,并通过设置其“相对路径”来制作一个图文混排页面,如下图所示。
HTML网页中任何元素的实现都要依靠HTML标记,要想在网页中显示图像就需要使用图像标记,接下来将详细介绍图像标记以及和它相关的属性。其基本语法格式如下:
该语法中src属性用于指定图像文件的路径和文件名,它是img标记的必需属性。
(1)图像的替换文本属性alt
由于一些原因图像可能无法正常显示,比如网速太慢,浏览器版本过低等。因此为页面上的图像加上替换文本是个很好的习惯,在图像无法显示时告诉用户该图片的内容。这就需要使用图像的alt属性,接下来通过一个案例来演示alt属性的用法。
注意:各浏览器对alt属性的解析不同,本书这里使用的是Firefox,如果使用其他的浏览器如IE、谷歌等,显示效果可能存在一定的差异。
各浏览器对alt属性的解析不同,本书这里使用的是Firefox,如果使用其他的浏览器如IE、谷歌等,显示效果可能存在一定的差异。
多学一招:使用title属性设置提示文字
图像标记有一个和alt属性十分类似的属性title,title属性用于设置鼠标悬停时图像的提示文字,下面来演示title属性的使用。
(2)图像的宽度、高度属性width、height
通常情况下,如果不给标记设置宽和高,图片就会按照它的原始尺寸显示,当然也可以手动更改图片的大小。width和height属性用来定义图片的宽度和高度,通常我们只设置其中的一个,另一个会按原图等比例显示。如果同时设置两个属性,且其比例和原图大小的比例不一致,显示的图像就会变形或失真。
(3)图像的边框属性border
默认情况下图像是没有边框的,通过border属性可以为图像添加边框、设置边框的宽度,但边框颜色的调整仅仅通过HTML属性是不能够实现的。
了解了图像的宽度、高度以及边框属性,接下来使用这些属性对图像进行修饰。
(4)图像的边距属性vspace和hspace
在网页中,由于排版需要,有时候还需要调整图像的边距。HTML中通过vspace和hspace属性可以分别调整图像的垂直边距和水平边距。
(5)图像的对齐属性align
图文混排是网页中的常见效果,默认情况下图像的底部会相对于文本的第一行文字对齐,如下图所示。但是在制作网页时经常需要实现图像和文字的环绕效果,例如图像居左文字居右等,这就需要使用图像的对齐属性align。
网页中的路径通常分为两种,具体如下:
(1)绝对路径
绝对路径一般是指带有盘符的路径。
例如:
“D:\HTML+CSS+JavaScript网页制作案例教程\教材案例\chapter02 \images\logo.gif”,或完整的网络地址。
例如:
“”。
(2)相对路径
相对路径不带有盘符,通常是以HTML网页文件为起点,通过层级关系描述目标图像的位置。
例如:
相对路径的设置分为以下3种:
?图像文件和html文件位于同一文件夹:只需输入图像文件的名称即可,如。
?图像文件位于html文件的下一级文件夹:输入文件夹名和文件名,之间用“/”隔开,如。
?图像文件位于html文件的上一级文件夹:在文件名之前加入“../”,如果是上两级,则需要使用“../ ../”,以此类推,如。
(1)GIF格式
GIF最突出的地方就是它支持动画,同时GIF也是一种无损的图像格式,也就是说修改图片之后,图片质量几乎没有损失。再加上GIF支持透明(全透明或全不透明),因此很适合在互联网上使用。但GIF只能处理256种颜色。在网页制作中,GIF格式常常用于Logo、小图标及其他色彩相对单一的图像。
(2)PNG格式
PNG包括PNG-8和真色彩PNG(PNG-24和PNG-32)。相对于GIF,PNG最大的优势是体积更小,支持alpha 透明(全透明,半透明,全不透明),并且颜色过渡更平滑,但PNG不支持动画。同时需要注意的是IE6是可以支持PNG-8的,但在处理PNG-24的透明时会显示为灰色。通常,图片保存为PNG-8会在同等质量下获得比GIF更小的体积,而半透明的图片只能使用PNG-24。
(3)JPG格式
JPG所能显示的颜色比GIF和PNG要多的多,可以用来保存超过256种颜色的图像,但是JPG是一种有损压缩的图像格式,这就意味着每修改一次图片都会造成一些图像数据的丢失。JPG是特别为照片图像设计的文件格式,网页制作过程中类似于照片的图像比如横幅广告(banner)、商品图片、较大的插图等都可以保存为JPG格式。
2.3
HTML知识点总结 第一章知识总结 1.HTML文档结构(括号里面的是注释)
(头部部分) (可写可不写)3)
(段落的对其方式) 换行标签
6.图片标签
(align是用于调整图片相对于周围文本的对其方式) 7.文字布局 1)水平线
《HTML基础试题》
《HTML基础试题》 一、单项选择题: 1、下面哪一个属性不就是文本的标签属性?( ) A. B.size C.color D.face 2、当链接指向下列哪一种文件时,不打开该文件,而就是提供给浏览器下载。( ) A.ASP B.HTML C.ZIP D.CGI 3、关于文本水平对齐,源代码设置不正确的一项就是:( ) A.居中对齐:
…B.居右对齐:…C.居左对齐:…D.两端对齐:…4、下面哪一项就是换行符标签?( ) A. B. C.
D. 5、下列哪一项就是在新窗口中打开网页文档。( ) A._self B._blank C._top D._parent 6、下面对JPEG格式描述不正确的一项就是。( ) A.照片、油画与一些细腻、讲求色彩浓淡的图片常采用JPEG格式 B.JPEG支持很高的压缩率,因此其图像的下载速度非常快 C.最高只能以256色显示的用户可能无法观瞧JPEG图像 D.采用JPEG格式对图片进行压缩后,还能再打开图片,然后对它重新整饰、编辑、压缩 7、常用的网页图像格式有____与_____( ) A、gif,tiff B.tiff,jpg C.gif,jpg D.bmp,png 8、下面说法错误的就是( ) A、CSS样式表可以将格式与结构分离 B.CSS样式表可以控制页面的布局 C、CSS样式表可以使许多网页同时更新 D.CSS样式表不能制作体积更小下载更快的网页 9、CSS样式表不可能实现( )功能。 A将格式与结构分离 B.一个CSS文件控制多个网页 C、控制图片的精确位置 D.兼容所有的浏览器 10、在HTML中,( )不就是链接的目标属性。 A、self B.new C.blank D.top 11、在网页设计中,( )就是所有页面中的重中之重,就是一个网站的灵魂所在。 A.标题栏 B.脚本页面 C、导航栏 D.页面内容 12、为了标识一个HTML文件应该使用的HTML标记就是( )。 A. B.C. D. 13、在客户端网页脚本语言中最为通用的就是( ) A、JavaScript B、VB C.Perl D、ASP 14、在HTML中,标记的属性:“Size”所能取的最大取值就是( ) A、6 B.7 C.8 D.9 15、下面不属于CSS插入形式的就是( ) A、索引式 B.内联式 C.嵌入式 D.外部式 16、如果站点服务器支持安全套接层(SSL),那么连接到安全站点上的所有URL开头就是( ) A.http:// B.https:// C.shttp:// D.SSL://
HTML知识点汇总
HTML知识点汇总 第一章HTML基础知识 1、HTML简介 HTML(Hypertext Markup Language),超文本标记语言,HTML利用各种标记来标识文档的结构以及标识超链接的信息。它是从SGML(Standard Generalized Markup Language,标准通用标识语言)中的一个子集演变而来的。 2、HTML的标记组成 HTML用于描述功能的符号称为“标记”。标记在使用时必须用尖括号“<>”括起来,而且是成对出现的,无斜杠的标记表示该标记的作用开始,有斜杠的标记表示该标记的作用结束。如
、 等 1)单标记:有些标记能完整的表达标记里的意思,只须在尖括号中输入标记名即可,这类标记叫 单标记。XHTML中要求单标记也必须闭合,即在标记“>”前添加斜杠。常见的单标记如
、
等。 2)双标记:双标记有头有尾,且前面的标记与后面的标记保持一致,但在后面的标记前有斜线, 语法形如:<标记>内容标记>。例如:段落 3)XHTML要求所有标记均为小写,且所有标记属性必须添加双引号 4)标记对不能交叉 3、HTML基本结构网页标题 1)标记对不能放在 标记对中,同理,其它表示内容的标记也不能放在标记对 中 2)表示HTML语言,在里面包含头部()和内容体 ()。 1页HTML笔试题目(附答案)HTML基础知识笔试题目(附答案)
) ) web 页的软件? (B )(选择1项) ) Internet Explorer ) FTP A ) place=middle B C ) align=center D 8、 {HTML 题目}将当前页面的背景色为 蓝色, 择1项) A ) bgcolor="blue" C ) backcolor="blue" 9、 {HTML 题目} A 文件夹与 现在我们希望在 B D B 文件夹是同级文件夹,其中 ) type=middle ) type=center 应该使用哪一句代码来描述此种设置 ( A ) (选 ) bgground="blue" ) background="blue" A 下有 a.htm , B 下有 b.htm 文件, a.htm 文件中创建超链接,链接到 b.htm ,应该在 a.htm 页面代码中如何描 1、 {HTML 题目}在HTML 页面中制作一个图像,想要在鼠标指向这个图像时浮出一条提示信 息,应该使用的参数是 :( C ) ( 选择 1 项) A) POP B) SRC C) ALT D) MSG 2、 {HTML 题目}在页面中看不见的表单元素是 那种? (C )(选择1项) A) B C) D 3、(HTML 题目)以下哪一个项目是用来访问 A) Outlook Express B C) QQ D 4. {HTML 题目}下面关于CSS 表述正确的是(A,C,D )(选择3项) A) CSS 是一种制作网页的新技术,现在已经为大多数的浏览器所支持,成为网页设计 必不可少的工具之一。 B) 层叠样式表是 HTML 的辅助工具, 缺点是设计者设计的网页缺少动感, 网页内容的 排版布局上也有很多困难 C) 使用 CSS 能够简化网页的格式代码, 加快下载显示的速度,也减少了需要上传的代 码数量,大大减少了重复劳动的工作量。 D) CSS 是Cascading Stylesheets 的缩写,中文意思是层叠样式表 5、 {HTML 题目}下面的标记用于表示 HTML 文档的结束的是:(B )( 选择1项) A) /BODY B) /HTML C) /TABLE D) /TITLE 6、 {HTML 题目}在Html 标记中,哪个标记表示表格 (C )(选择1项) A)
B )
C) D )
7、{HTML 题目}在Html 标记中,用什么方法可以将整个表格在页面中居中 (C )( 选择1 项) 述链接内容( C ) ( 选择 1 项) A) b.htm B ) ././././B/b.htm C) ../B/b.htm D../../b.htm 10、 {HTML 题目 }语句 A :HTML 文档必须包括“头”和“主体”两部分 语句B : HTML 文档的扩展名为.htm 或.html ( D ) (选择 1 项) A)两句都对 B)两句都错 C)只有A 对 D)只有B 对 11、 {HTML 题目}我们想要在 HTML 文档中加入图像,可以使用哪个标记来达到要求呢? (选 择1项)( C ) A) B )