课程介绍:
    HTML是网页制作的必备技能
    HTML概念、语法以及常用基础标签


    学习内容:
    1、HTML概念
    2、了解HTML发展史
    3、基础语法
    4、常用标签 — 段落、图片,链接
    5、结合以上开发小案例


    HTML概念
    HTML4基础 -- 课件 - 图1
    1、超文本标记语言
    2、Hypertext Markup language


    HTML发展史
    1、1993 ietf HTML1.0版本
    2、1995 W3c(www)万维网 更新HTML2.0
    3、1996 - 1999 html4.0(基础)
    4、2000 XHTML1.0(xml html)
    5、2014至今 HTML5.0


    特点:
    1、HTML不需要编译,直接通过浏览器展现
    2、HTML文件是一个文本文件
    3、必须使用HTML /HTM作为文件的后缀名
    4、大小写不敏感,HTML与html一样



    开发工具:
    1、普通:记事本、word
    2、Dreamviewer — DW webstorm — ws sublime hbuilder — app


    HTML课程内容:
    1、基本结构
    2、标签
    3、元素
    4、属性
    5、注释


    基本结构:三部分
    1、头部信息
    HTML4基础 -- 课件 - 图2

    2、网页主题部分
    HTML4基础 -- 课件 - 图3

    3、整个HTML文件
    HTML4基础 -- 课件 - 图4


    添加标签的属性的语法如下:
    语法:<标签名 属性名1=”属性值” 属性名2=”属性值”>….</标签名>
    整体页面内容:
    HTML4基础 -- 课件 - 图5


    文档段落
    1、文档类型声明 DOCTYPE
    2、<!DOCTYPE>声明必须放在HTML文档的第一行
    3、<!DOCTYPE>声明不是HTML标签


    网页编码设置
    问题:当网页显示出现乱码
    解决:在 之间添加处理中文乱码标签

    注意:utf-8 gbk gb2312 iso8859-1
    HTML4基础 -- 课件 - 图6


    文字和段落
    标题标签:

    ~

    段落标签:


    align属性 — 对齐方式的属性:
    left 左对齐内容
    Right 右对齐
    Center 居中
    Justify 对行进行伸展,这样使得每行都会有相等的长度


    换行标签:

    预编译:
    1.  



    修饰符标签和特殊符号:
    1、水平线标签:

    2、文字斜体:
    3、加粗:
    4、下标:
    5、上标:


    特殊符号:
    1、< <
    2、> >
    3、® 已注册
    4、© © 版权
    5、™ TM商标
    6、  space空格


    列表标签: — 三种
    1、无序列表
    2、有序列表
    3、定义列表



    无序列表
    type属性:
    disc 圆点
    Square 正方形
    Circle 空心圆


    有序列表;ol
    type属性:
    1 数字 1 2 3。。。。
    a 小写字母 a b ….
    A 大写的字母 A B …
    i 小写罗马数字i ii iii
    I 大写的罗马数字I II III


    定义列表:
    dl > dt(列表项名字)/dd(具体列表内容)
    说明:
    1、定义标签内可以有多个dt
    2、对于每一个dt可以有多个dd


    调试 — 反复差错!F12和右键查看网页源代码


    1、图像和超链接
    图像标签:
    语法:””/
    img属性:
    1、 Src — url — 显示图像的地址
    2、 Alt — 文字 — 图像替代文本
    3、 Height — 数值和百分比 — 图像的高
    4、 Width — 数值和百分比 — 图像的高

    Img下的src属性 — 设计到图像的路径问题:
    1、绝对路径 — 指的是具体盘符下的具体路径
    2、相对路径 — 指的是相对于当前文件的这个图片的路径
    (1) 处于同一级目录中
    (2) 图片处于文件的上一级
    (3) 图片在img文件的下一级



    Img还有alt属性,当图片显示不出来的时候,会显示alt的值
    1、网速太慢
    2、Src属性值错误
    3、用户无法查看图像的时候


    高度和宽度设置,两种表示方式:
    1、px表示像素
    2、用%百分比表示,该图片占父容器的百分之多少


    超链接
    语法:内容
    Href:链接地址,可以是内部链接也可以是外部链接
    Target:链接的目标窗口 — _self _blank _top _parent
    Titile:链接提示文字
    Name:链接命名


    Target:
    1、_self — 和默认形式一样,都是默认当前打开页面
    2、_blank — 表示点击另开一个页面


    锚链接 语法:内容 — 同一个页面内
    1、Href
    2、Name
    3、形式如下:
    (1) 目录1
    (2) 内容


    锚链接 语法:内容 — 不同页面
    语法:
    网页1:…..
    网页2:…..


    超链接扩展功能:
    电子邮件链接:….




    文件下载: — href属性
    1、如果是url地址,那么会打开地址对应的网页
    2、如果是文件,就会相应的下载
    3、语法:


    课程总结:
    1、HTML基本结构 — 头部 网页 HTML文件
    2、声明标签 — <!DOCTYPE HTML> — 不是html标签 — 声明必须放第一行
    3、出现乱码 — 添加meta
    4、标题标签 — h1 - h6 — 段落 — p — align
    5、换行

    6、文字斜体:i em
    7、加粗 b strong
    8、下标sub 上标 sup
    9、无序列表 ul li type
    10、有序列表 ol li type
    11、定义列表 dl dt dd dd dt dd dd dd
    12、图片标签 — img — src — alt — height — width
    13、超链接 — a — href — target — titile — name
    14、锚点
    15、电子邮件
    16、下载文件