Html学习笔记

一、HTML的概述(了解)

  a.html是什么 : hypertext markup language 超文本标记语言
    超文本:音频,视频,图片称为超文本。.
    标记 :<英文单词或者字母>称为标记.

    一个HTML页面都是由各种标记组成。
  b.作用:编写HTML页面。
  c.HTML语言不是一个编程语言(有编译过程),而是一个标记语言(没有编译过程).     HTML页面直接由浏览器解析执行。

二、HTML的网络术语(明白)

* 网页 :由各种标记组成的一个页面就叫网页 .
* 主页(首页) : 一个网站的起始页面或者导航页面 .
* 标记:

称为开始标记

称为结束标记. 也叫标签.每个标签都规定好了特殊的含义。
* 元素

内容

称为元素.
* 属性: 给每一个标签所做的辅助信息。
* xhtml: 符合XML语法标准的HTML。
* dhtml:dynamic,动态的。javascript + css + html 合起来的页面就是一个dhtml
* http:协议标准。用来规定客户端浏览器和服务端交互时数据的一个格式。SMTP 邮件传输协议,ftp:文件传输协议.

三、HTML的规范(知道)

*.HTML是一个弱势语言
*.html 不区分大小写
*.html页面的后缀名是html或者htm(有一些系统不支持后缀名长度超过3个字符,比如dos系统)
*.html 的结构
  1)声明部分:主要作用是用来告诉浏览器这个页面使用的是那个标准。

      是HTML5标准。
  2)head部分: 不会显示在页面上。作用是告诉浏览器一些页面的额外信息。
  3)body部分:我们缩写的代码必须放在此标签內。

六、HTML的各种标签(掌握)

明确:每个标签都有私有属性。也都有公有属性。
    html中表示长度的单位都是像素。HTML只有一种单位就是像素。
body:
  bgcolor: 背景颜色
  background:背景图片
  text: 文本颜色


1、排版标签

所有的浏览器默认情况下都会忽略空格和空行
P: p代表一个段落
  属性: align:对齐方式. 取值:left,right,center

代表是换行。
hr:
  color: 线的颜色
  size : 线的粗细
  width: 线的长短
    两种写法: 1) 绝对值 eg: 500  2) 相对值: 50%
  noshade: 不要阴影

center: 内容居中
pre: 预定义格式标签 .告诉浏览器不要忽略空格和空行
div: 块级标签 必须单独占据一行
  属性: align :  校准  center(中间)
span: 块级标签 不换行字体标记

2 、字体标签

h1...h6:定义字体大小
  属性: align :居中
font:
  color: 字体颜色
      颜色的写法有3种: 1)英文单词: red   

               2)十六进制:#00ffcc    

               3)RGB(三原色) : new RGB(124,156,23)
  size: 字体大小
  face: 字体类型
特殊字符:

  <小于 >大于 & &符号 " 双引号'单引号
  © 版权 ™商标  空格
扩展:

  绐 (指定输出字符)
  b: 加粗
  strong: 加粗
  i:斜体
  em: 斜体
  u: 下划线
  s: 中划线(删除线)
  sup: 上标
  sub: 下标.

3.图像标记

img: 代表是一副图片
  属性: src : 图片的路径
      两种写法:a) : 相对路径 路径是相对页面所在的路径 两个标记.和.. ,分表代表当前目录和父路径
       b) :绝对路径
1) : 以盘符开始的路径
  eg: C:\Documents and Settings\Administrator\桌面\day01_html\上课示例/images/1.jpg
2) : 网络路径
  eg: http://www.baidu.com/images
  width: 宽度
  height:高度
  Alt:当图片显示不出来的时候代替图片显示的内容
  title: 提示性文本
  border: 边框
  热点: 就是特定的位置添加超链。
    
    
    
    

4.清单标记
  列表标签:3种
    a.无序列表ul
      属性:type : 值: disc(默认,实心原点),square(实心方点),circle(空心圆)
    b.有序列表(OL)
      属性: type:取值:1(阿拉伯数字,默认),a,A,i,I
      start: 从几开始
    c.定义列表(dl)
      dt: 列表项的标题
      dd: 列表项
5.超链接
  3种超链接:
    1. 连接到其他页面
    2. 锚: 指给超链接起一个名字,作用是连接到本页面或者其他页面的特定位置。使用name属性给超链起名字
    3. 连接到邮件: 进入我的邮箱
  属性:target: 告诉浏览器怎么显示目标页面
  HTML中已定义4个值: _self :在同一个浏览器中显示
             _blank: 打开新的浏览器显示
             _parent: 在父窗口中显示
             _top: 在顶级窗口中显示
6.表格标记
  table: 表格
    属性:border:边框
    width:宽度
    height:高度
    align:表格的对齐方式
    cellpadding:单元格内容到边的距离
    cellspacing:单元格和单元格之间的距离
    bgcolor:背景颜色
    background:背景图片
    bordercolorlight:表格的上,左边框,以及单元格的右,下边框的颜色
    bordercolordark: 表格的右,下边框,以及单元格上,左的边框的颜色
    dir:单元格内容的排列方式 取值:ltr 从左到右, rtl:从右到左
  tr: 行
    属性:dir:
      bgcolor:
  td: 单元格
    属性: align: 内容的横向对齐方式
    valign: 内容的纵向对齐方式 top,middle,bottom
    width: 绝对值或者相对值(%)
    height:单元格的高度

  单元格的合并:
    单元格的属性:
      colspan: 横向合并
      rowspan: 纵向合并
  th: 相当于 +
    属性同
  caption: 表格的标题
    属性:align: 取值:left,center,right,top,bottom
    thead
    tbody
    tfoot
  写与不写的区别:
      1. 当表格非常大的时候,如果不写,则必须等表格的内容全部下载完成才能显示。但是用tbody标签的话,那么边下载边显示。

      2.如果不写thead,tbody,tfoot那么浏览器解析表格内容的时候是从上到下解析。如果写了,那么顺序任意,

       浏览器解析的时候还是按照thead,tbody,tfoot的顺序显示内容
7.框架标记及