十天学会HTML:第二天 HTML 元素和基本结构

本章讲解HTML 的基本结构、HTML 控制标记的格式和最常用的控制标记,也就是创建文档结构所需的元素。例如:标题、段落、页面分隔、注释等等。



HTML 文档是由 HTML 元素构成的文本文件,HTML 元素是通过使用 HTML 标签进行定义的。



一、HTML 的基本结构

  1. <html>   <!–根控制标记–>
  2. <head>      <!–头控制标记–>
  3. <title>标题</title> <!–标题标记–>
  4. </head>      <!–头控制标记(尾)–>
  5. <body>
  6. 网页内容显示区域
  7. </body>
  8. </html>     <!–根控制标记(尾)–>

复制代码

以上就是一个最基本的网页,把后面的注释去掉,复制到记事本,然后把txt格式修改为htm就是最简单的一个网页。



1、<html>…</html>根控制标记开头和结尾成对出现,双标签



2、<head>…</head>头控制标记



  2.1<title>很单纯的文件标题声明



  2.2<meta>控制标记的动态文件转换声明



  2.3<base>超链接网址基准参考点



  2.4Javascript 和VBScript 程序



  2.5stylesheet 可用来设置排版来的声明



  2.6<link>可引用外部文件,如CSS 排版样本



3、<title>…</title>设置浏览器的视窗标题



4、<body>…</body>页面可见内容



二、HTML 控制标记的格式



HTML 标签是用来标记 HTML 元素的,被 < 和 > 符号包围,这些包围的符号叫作尖括号,HTML 标签是成对出现的(也有单标签),例如 <b> 和 </b>,位于起始标签和终止标签之间的文本是元素的内容,HTML 标签对大小写不敏感,<b> 和 <B> 的作用的相同的。



1、<标记名称>单一型,无设置值的。如:<br>

2、<标记名称属性=”属性值”>单一型,有设置值的。如:

  1. <hr width=”80%”>

复制代码

3、<标记名称>…</标记名称> 对称型,无设置值。如:

  1. <title>…</title>

复制代码

4、<标记名称属性=”属性值”>…</标记名称> 对称型,有设置值。如:

  1. <body bgcolor=”red”>…</body> <font size= ”7”>…</font>

复制代码

三、 最常用的控制标记



1、换行、跳行<br>



格式:<br>无属性设置



2、段落<p>



格式:<p align=”排列方式”>…</p>



属性名称  属性值  说明

align    left    往左靠(默认)

      center   往中靠

      right   往右靠



3、水平直线<hr>



格式:<hr>



属性名称    属性值       说明



size 像素绝对设置,以数字表示,属性值越大,线越粗



百分比相对设置,以%表示,属性值越大,线越粗



width 像素绝对设置,长度不会应视窗的改变而改变



百分比相对设置,长度会随着视窗宽度而改变



noshade   实体线



4、向中对齐<center> (被废弃的标签)



格式:<center>…</center>



5、背景色与文字设置



格式:<body bgcolor=”背景色” text=”文字颜色”>



整体页面的边距,行距

  1. <body leftmargin=”像素” topmargin=”像素”>

复制代码

6、标题文字设置



格式:

  1. <h1>…</h1>
  2. <h2>…</h2>
  3. <h3>…</h3>
  4. <h4>…</h4>
  5. <h5>…</h5>
  6. <h6>…</h6>

复制代码

属性名称  属性值  说明

 align    left   靠左

      center  靠中

      right   靠右



7、特殊字符设置



格式:

  1. < lt;
  2. > gt;
  3. & amp;
  4. “ quot;

复制代码

8、在HTML 备注



格式:

  1. <!–…–>

复制代码

9、实体字符控制标记

  1. <b>…</b>    粗
  2. <i>…</i>     斜
  3. <s>…</s>    删
  4. <u>…</u>   下划
  5. <tt>…</tt>   电报
  6. <sub>…</sub> 下标
  7. <sup>…</sup> 上标

复制代码

10、语意字符控制

  1. <address>…</address>  地址
  2. <big>…</big>      大字
  3. <del>…</del>       删除
  4. <ins>…</ins>      修改
  5. <samll>…</small>    小字
  6. <strong>…</strong>   加强语气(加粗)
  7. <em>…</em>      加强语气(倾斜)

复制代码

11、<font>字体控制(被废弃的标签)



格式:<font>…</font>

属性名称 属性值 说明

 size    0-7  字体大小

 color  英文或十六颜色

 face   字体  字体



12、格式化

格式:<pre>…</pre>

让书写的文字格式化!



13、引用文本



格式:<blockquote>…</blockquote>

属性名称 属性值 说明

cite    url   被引用的地址



我们刚才讲到:HTML 标签对大小写是不敏感的:<b> 和 <B> 的作用的相同的。但在书写代码的时候尽量使用小写html标签。万维网协会 (W3C) 的标准是:建议在 HTML 4 中使用小写标签,而在 XHTML(下一代 HTML)中,必须使用小写标签。

-=||=-收藏

未经允许不得转载:云破天开 » 十天学会HTML:第二天 HTML 元素和基本结构

评论

9+2=