HTML基础总结–页面与标记(一)

小C为大家带来一部分HTML基础的总结希望大家喜欢,想温故而知新的可以看下,小C希望大神勿喷,如发现错误和不懂的地方请在下面留言,小C将非常感谢。

HTML基础总结--页面与标记(一)

HTML概念

1、HTML是Hypertext Markup Language(超文本标记语言)的缩写,它是构成Web页面(Page)的主要工具,是用来表示网上信息的符号标记语言。

2、HTML文档由文本和HTML标记组成,通常以.html或者.htm为文本的扩展名(如index.htm)

3、浏览器负责翻译HTML文档中的标记,并将HTML文档显示为网页。

4、HTML标记是由浏览器负责解释执行的,不同的浏览器中网页的显示效果可能不同。

5、大多数浏览器不完全支持HTML的所有特性,每一种浏览器都可能会有一些特有的HTML标记和属性,这些标记和属性可能不会被其他的浏览器识别。这些由软件公司开发的标记和属性被称为HTML扩展,而不是标记的一部分。

HTML标记

HTML标记的基本格式:

<标记>文件内容</标记>

某些标记还可以包含一些属性:

<标记名称 属性1 属性2 属性3 …… >

用来注释的标记

<!-- 内容 -->

HTML页面的基本结构

基本结构:起始标记、网页标题、文件主体

如下所示:

<html>

<head>

网页的标题和属性

</head>

<body>

文件主体,要显示的内容

</body>

</html>

起始标记<html></html>

1、<html>标记用于HTML文档的最前面,用来标记HTML文档的开始

2、</html>则是放在HTML文档的最后面,用来表示HTML文档的结束

3、必须配对使用

头标记<head></head>

1、<head></head>标记对构成HTML文档的开头部分

2、<head></head>标记对之间可以包含其他标记:

title标记: <title>文件标题</title>

主体标记<body></body>

1、<body></body>标记对之间的内容是HTML文档的主要部分,在此标记对之间可包含众多的标记和信息。

2、<body>标记可以设置如下的属性:

bgcolor=“颜色”

background=“图片地址”

超链接

超级链接

超级链接:简称超链接。从一个页面链接到另一个页面。使用方法:

  1. <a href="photo.html">相册</a>
  2. <a href="http://www.baidu.com">百度</a>

相对路径和绝对路径:假定a.html和b.html均放在e:\myweb文件夹中,在a.html页面中链接到b.html;

采用相对路径时: <a href="b.html">B</a>

采用绝对路径时:<a href="e:\myweb\b.html">B</a>

邮件链接

邮件链接:可使访问者在浏览页面时,只需单击电子邮件链接就能打开默认的邮件编辑软件,向指定的地址发送邮件。

标题标记(<hn>)

1、一般文章都有标题、副标题、章和节等结构, HTML中也提供了相应的标题标记<hn>,其中n为标题的等级。

2、HTML提供6个等级的标题,n越小,标题的字号就越大。

3、<hn>可以有对齐属性,align=#

#表示:left 标题居左;center 标题居中;right 标题居右

段落标记与换行标记

1、在文章的排版过程中,段落与段落之间是有间隔的,HTML中提供了<p>标记来实现;<p>与<hn>标记一样,可以有align属性

2、<br>标记可以创建一个回车换行

字体标记(<font>)

1、<font>的常用方式:

  1. <font face="华文彩云" size="6" color="#6600FF">态度决定一切</font>

2、face设置文字的字形

3、size设置文字的大小,其值可以是绝对或相对 ,html有七种字号,1号最小,7号最大,缺省字号为3;相对值可以表示为+2 、+3等

4、color设置文字的颜色,可以采用red、blue、green等值,也可以采用6位十六进制,分别指定红、绿、蓝的值

字体风格

1、字体风格可以分为物理风格和逻辑风格;

2、指定物理风格的常用标记有:

<b>黑体、<i>斜体、<u>下划线、<s>删除线

3、指定逻辑风格的常用标记有:

<strong>强调

<small>较小、<big>较大

<sup>上标、<sub>下标等

水平线(<hr>)

1、<hr>的常用方式:

  1. <hr align="center" size="10" width="50%" color="red">

2、align设置线的对齐方式

3、size设置线条的粗细,以像素为单位,默认值是2

4、width设置线条长度,以像素为单位,可以采用像素值或百分比

5、color设置线条的颜色

滚动字符(<marquee>)

1、<marquee>的常用方式:<marquee direction=up behavior=alternate height=400>欢迎光临本站</marquee>

2、direction设置活动字幕的滚动方向,可以是up、down、left、right

3、behavior设置滚动的方式,可以是scroll(一端滚动到另一端)、slide(一端快速滑动到另一端,且不再重复)、alternate(在两端之间来回滚动)

4、height设置滚动字幕的高度

其他属性还有:

5、bgcolor:用于设定活动字幕的背景颜色

6、width:则设定滚动字幕的宽度

7、hspace和vspace:分别用于设定滚动字幕的左右边框和上下边框的宽度。

8、scrollamount:用于设定活动字幕两次之间的滚动距离。

9、scrolldelay:用于设定滚动两次之间的延迟时间。

10、loop:用于设定滚动的次数,当loop=-1表示一直滚动下去,直到页面更新

图像标记(<img>)

属性介绍:

src:设置图片的路径,一般使用相对路径。

width和height:设置图片的宽和高,一般设为图像的真实大小,以免失真。

alt:设置描述该图形的文字。

border:设置图像的边框,以像素为单位。

align:用来调整图片旁边文字的位置,你可以控制文字出现在图片的偏上方、中间、底部、 左右等,可选值:top, middle, bottom, left, right,内定为bottom

如果你对小C有什么意见和建议的话请在下面留言。

未完待续...

下篇传送阵:HTML基础总结–框架和浮动窗口(二)

您可以选择一种方式赞助本站

支付宝扫一扫赞助

微信钱包扫描赞助

    A+
发布日期:2016年02月18日  所属分类:HTML  Web
标签:

发表评论

gravatar

:?::razz::sad::evil::!::smile::oops::grin::eek::shock::???::cool::lol::mad::twisted::roll::wink::idea::arrow::neutral::cry::mrgreen:

目前评论:2   其中:访客  2   博主  0

  1. avatar 阅乎之 2

    我搞错了,这里不是css :evil: :???:

  2. avatar 阅乎之 2

    a、字体风格2, 一般称呼加粗,粗体。

    b、字体标记的1,face 我没接触过,求解,我知道有个font-family

评论加载中...