你的位置:首页 > 网页设计

[网页设计]HTML 自学笔记(HTML的基本结构+文档设置标记)


HTML的基本结构

  1. <html>html文档的标记,也称html开始标记</html>
  2. <head>html文件头标记,也称html头信息开始标记</head>

 功能:用来包含文件的基本信息,比如网页的标题。

 注:在<head></head>标记内的内容不会在浏览器中显示。该标签内可以放<title></title>,<meta></meta>,<style></style>等标记。

3.<title>HTML文件标题标记</title>

功能:页面的“主题”显示在浏览器窗口的左上方。

注:网页的标题不能太长,要短小精干,能够反映页面的内容。<title></title>标签中不能包含其他标记。

4.<body>HTML的主体标记</body>

功能:该标记是网页的主体部分,在标记之间可包含如:<p></p>,<hn></hn>,<br></br>等标记,这是这些内容组成了我们所看到的网页。

常见属性:bgcolor(背景颜色)、text(设置文本颜色)、link(设置链接颜色)、vlink(已访问链接的颜色)、alink(正点击链接的颜色)

如:<body alink="red"></body>

5.<meta>页面的元信息(meta-information)

功能:提供有关页面的元信息,比如针对搜索引擎和更新频度的描述和关键字。

必要的属性:content 值 some text 定义name属性相关的元信息。

常见name属性:author(网页作者) keyword(网页关键词) description(网页描述) others(其他语言信息)

注:<meta>必须放在head元素里面。

 

HTML文档设置标记

     Ⅰ.格式标记

    1. <br>强制换行,让后面的文字,图片,表格等显示到下一行。
    2. <p>换段落标记。由于多个空格或者回车在HTML中会被等效为一个空格,所以HTML中要换段落就要用到p标签,p标签也可以嵌套。
    3. <center>居中对齐,及让段落或者文字相对于父标记居中显示。
    4. <pre>预格式化标记,保留预先编排好的格式。<pre>内容(其中有空格或多空格均可显示)</pre>。
    5. <li>列表标记。<li>内容</li>。
    6. <ul>无序列表标记。
    7. <ol>有序列表。与li标签混合使用。其中,符号类型包含”a" "A" "1" "Ⅰ"等
      1. 格式
        <ol type="符号类型“><li>内容1</li><li>内容2</li></ol>
      2. 指定列表起始值

<li value="">

8.<dl><dt><dd>定义型列表

使用场合:对列表条目进行简短的说明

格式:<dt>和<dd>都是在<dl>里面

<dl>

<dt>软件说明:</dt>

<dd>简单介绍软件功能及基本应用</dd>

</dl>

9.<hr>水平分割线标记:段落之间的分割线。单标记。

10.<div>分区显示标记也称层标记

 常用来编排一大段落的HTML段落,也可以用于格式化表和P很相似,div可多层嵌套。

     Ⅱ.文本标记

  1. hn  标题标记,共6个级别,对应显示不同大小的标题,其中h1最大h6最小。
  2. font  字体设置标记,共有三种属性。
    1. size (字体大小)<font size="数值">数值取1-7
    2. color(字体颜色)<font color="">
    3. face (字体类型)<font face="宋体">
  3. <b>粗字体标记</b>
  4. <i>斜字体标记</i>
  5. <sub>字体的上标记
  6. <cite>引用方式的字体,通常是斜体(如引用文献)</cite>
  7. <em>表示强调,通常显示斜体</em>
  8. <strong>表示强调,通常显示为粗字体</strong>
  9. <small>小字体,可嵌套</small>
  10. <big>大字体,可嵌套</big>
  11. <u>下划线</u>