网页设计基础教案.pptVIP

网页设计基础 第一章 网页的基本知识 1.1 Internet简介 1.1.1 Internet的起源和发展 1.1.2 Internet在中国的发展 1.1.3 Internet的功能 1.1.4 几个名词 1.2 超文本描述语言 HTML 1.2.1 什么是HTML 1.2.2 Html文件的组成 什么是Internet？ 简单地说，Internet是由遍布全球的各种网络系统、主机系统，通过统一的协议连接在一起所组成的世界性计算机网络系统。 什么是HTML? 第二章 网页的基本结构 2．1Html文件的基本结构 2．2．1 标记及其属性 标记：标记 受标记影响的内容 /标记 标记的属性：标记 属性1＝属性值 属性2＝属性值 …… 例：Font color=red红色/Font 2．2．2基本结构 Html Head Title网页的标题/Title /Head Body 网页的内容 /Body /Html 1．html…/html 2．head…/head 3．title…/title 4．meta meta http-equiv=Content-Type content=text/html; charset=gb2312 META http-equiv=refresh; content=1;url=/ 5．body…body 格式：Body bgcolor=“颜色值” background=“文件名” text= “颜色值” link=“颜色值” vlink= “颜色值” alink= “颜色值” …… /body text=“#000000” 用以设定文字颜色。 #000000 代表黑色，亦可以采用颜色的名称，即 text=“black” 。link=“#0000FF” 设定一般文字链接颜色。 alink=#FF0000 设定刚按下时文字链接颜色。 vlink=#0000FF 设定链接后的颜色。（被按过）。 background=“bg1.gif” 设定背景墙纸。GIF 或 JPEG 皆可，可以是绝对路径或相对路径。 bgcolor=#FFFFFF 设定背景颜色。当己设定背景墙纸时会失去作用，除非墙纸有透明部分。 习题 创建一个简单的网页，要求网页的标题是“个人简介”，网页文本内容自定义，文件名为index.htm 。 用Body标记制作一张具有多种色彩的网页。 写出Html文件的总体结构。在Html文档中，有头标记Head和无头标记的区别有哪些？标题标记Title在网页中有何作用？ 第三章 段落和文字标记 3．1 段落标记 3．1．1注释标记 !--注解-- 像很多电脑语言一样，HTML 文件也提供注解功能。浏览器会忽略此标记中的文字（可以 是很多行）而不作显示 。 3．1．2 换行标记 BR称为换行标记。 作用：令字、画、表格等显示于下一行。 例子： 3．1．3 换段标记 P称为段落标记。 作用：为字、画、表格等之间留一空白行。 P 的常用参数： 如：p align=center align=center 可选值：right, left, center。 内定值： align=left 3．1．4 显示预排格式 PRE称为预设格式标记。 作用：按照原始码的排列方式显示。 这标记允许保留你在原始码中输入的空白及回车。 格式：Pre 预先排好的内容 /Pre 3．1．5 分区显示标记 DIV称为分区显示标记。 作用：设定字、画、表格等的摆放位置。 3．1．6 水平线 HR称为水平线。作用：插入一条水平线。 HR 的参数： 以： HR align=LEFT size=2 width=70% color=#0000FF noshade 为例。 align=LEFT 设定线条置放位置，可选择：left；right；center 三种设定值。 size=2 设定线条厚度，以像素作单位，内定为 2。 width=70% 设定线条长度，可以是绝对值（以像素作单位）或相对值，内定为 100%。 color=“#0000FF” 『只适用于IE』 设定线条颜色，内定为黑色。 #0000FF 代表蓝色，也可以采用颜色的名称，即 color=blue 。 noshade 设定线条为平面显示，若删去则具阴影或立体，这是内定值。 3．1．7其他排版标记 CENTER称为居中标记。 作用：令字、画、表格等显示于中间。 NOBR称为不换行标记。 作用：令某些文字不因太长而绕行，而是显示于同一行或下一 行。它对住址、数学算式、一行数字、程序