A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© Synaric 中级黑马   /  2015-9-26 16:29  /  291 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

给需要预习的同学,参照着学吧

一、HTML的概述(了解)

        a.html是什么 : hypertext markup language 超文本标记语言
                   超文本:音频,视频,图片称为超文本。.
                   标记 :<英文单词或者字母>称为标记. 一个HTML页面都是由各种标记组成。
    b.作用:编写HTML页面。
        c.HTML语言不是一个编程语言(有编译过程),而是一个标记语言(没有编译过程).
            HTML页面直接由浏览器解析执行。

二、HTML的历史(了解)

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

    * 网页 :由各种标记组成的一个页面就叫网页 .
    * 主页(首页) : 一个网站的起始页面或者导航页面 .
    * 标记:<p>称为开始标记  </p>称为结束标记. 也叫标签.每个标签都规定好了特殊的含义。
    * 元素:<p>内容</p> 称为元素.
    * 属性: 给每一个标签所做的辅助信息。
    * xhtml: 符合XML语法标准的HTML。
    * dhtml:dynamic,动态的。javascript + css + html 合起来的页面就是一个dhtml
    * http:协议标准。用来规定客户端浏览器和服务端交互时数据的一个格式。SMTP 邮件传输协议,ftp:文件传输协议.

四、HTML的编辑工具(了解)
        *.notepad 记事本
        *.editplus : 语法高亮显示
                技巧: 根据颜色判断单词是否出错。 (不是100%)
        *.ultraedit : 根据颜色判断单词是否出错,可以显示2进制数据.
        *.dw(dreamweaver,专业工具)  代码提示.

五、HTML的规范(知道)
    *.HTML是一个弱势语言
        *.html 不区分大小写
        *.html页面的后缀名是html或者htm(有一些系统不支持后缀名长度超过3个字符,比如dos系统)
        *.html 的结构
                1)声明部分。主要作用是用来告诉浏览器这个页面使用的是那个标准。<!doctype html>是HTML5标准。
                2)head部分: 不会显示在页面上。作用是告诉浏览器一些页面的额外信息。
                3)body部分:我们缩写的代码必须放在此标签內。

六、HTML的各种标签(掌握)
  明确:每个标签都有私有属性。也都有公有属性。
         html中表示长度的单位都是像素。HTML只有一种单位就是像素。
   body:  
                bgcolor: 背景颜色
                background:背景图片
                text: 文本颜色
               
*1.排版标签       
        所有的浏览器默认情况下都会忽略空格和空行
                P:p代表一个段落
                        属性: align:对齐方式. 取值:left,right,center
                <br>代表是换行。
                hr:
                        color: 线的颜色
                        size : 线的粗细
                        width: 线的长短
                                    两种写法: 1) 绝对值  eg: 500
                                                           2) 相对值: 50%
                        noshade: 不要阴影
                        align: 对齐方式 取值: left,right,center

                center: 内容居中
                pre: 预定义格式标签 .告诉浏览器不要忽略空格和空行
                div: 块级标签  必须单独占据一行
                           属性: align :
                span: 块级标签 不换行字体标记   
*2 字体标签
                h1...h6:定义字体大小
                        属性: align :居中
                font:
                        color:字体颜色
                                颜色的写法有3种: 1)英文单词: red
                                                              2)十六进制:#00ffcc
                                                                  3)RGB(三原色) : new RGB(124,156,23)
                        size:字体大小
                        face:字体类型
                特殊字符: &lt;小于 &gt;大于 &amp; &符号 &quot; 双引号&apos;单引号
                                           &copy; 版权 &trade;商标 &nbsp;空格
                                           扩展:绐
                #可选
                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: 边框
                热点: 就是特定的位置添加超链。
                                 <img src="images/1.jpg" width="300" height="300" usemap="#Map" border="0" />
                                        <map name="Map" id="Map">
                                                <area shape="circle" coords="122,81,38" href="demo_字体标签.html" />
                                        </map>
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. 连接到邮件: <a href = "mailto:xugang@itcast.cn">进入我的邮箱</a>
                                属性: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: 相当于<td> + <b>
                    属性同<td>
                caption: 表格的标题
                   属性:align: 取值:left,center,right,top,bottom
                thead
                tbody
                tfoot
                   写与不写的区别:
                           1. 当表格非常大的时候,如果不写,则必须等表格的内容全部下载完成才能显示。但是用tbody标签的话,那么边下载边显示。                                        2.如果不写thead,tbody,tfoot那么浏览器解析表格内容的时候是从上到下解析。如果写了,那么顺序任意,浏览器解析的时候还是按照thead,tbody,tfoot的顺序显示内容
7.框架标记及<iframe>
        框架页面上不允许有body标签
                frameset: 框架的集合
                        rows: 纵向分部框架.
                        cols: 横向分部框架.
                              写法有两种: 1) 绝对值  "200,*" ,*代表剩余的
                                                          2) 相对值  "30%,*"
                frame: 框架. 一个框架显示一个页面
                        scrolling: 是否需要滚动条。默认是true
                        noresize : 固定框架大小
                        bordercolor: 给框架边框起一个颜色
                        name : 给框架起一个名字
                                内嵌框架: 嵌入在一个页面上的框架.(仅仅IE支持)
                                iframe:
                                        属性: width: 宽度
                                                   height: 高度
                                                    scrolling : 是否需要滚动条
**8.表单标记及语义化
                text:可填文本框
                        maxsize:填写的最大文字数量
                        password
                checkbox
                select,option
                        selected:默认选中
                textarea
                buttom
                sbmit
                reset
               
                属性
                action
                method
               
                语义化
                fieldset
                        legend

9.多媒体标记
                bgsound: 背景音乐
                embed: 播放多媒体文件.
                marquee: 移动
                        属性:direction 移动目标方向 left,right ,up,down ,up,down移动距离是固定的200px
                                  behavior: 行为方式 取值:slide,alternate,scroll
                                  scrollamount : 移动速度
                                  loop: 循环多少圈。负值表示无限循环
                                  scrolldelay: 移动一次休息多长时间。单位是毫秒
10.头标记
                延时跳转
                <meta http-equiv = "refresh" content = "3;url=http://www.baidu.com">

0 个回复

您需要登录后才可以回帖 登录 | 加入黑马