chap0预备知识HTML.ppt

概述 1、 Web工作机制 概述 2、Web工作机制 概 述 请打开浏览器，在地址栏中输入以下地址 1） 8:8080/MyBlog-full 后台： name：admin psw：111 2） 8:8080/ProjManagement 管理员： name：manager psw：111 教 师： name：teacher psw：111 学 生： name：student psw：111 2. Html文档基本结构 练习：在记事本中键入如下代码，并把扩展名更改为.html或.htm html head/head body hellow html！ h1网页中的标题/h1 p网页中的段落/p hr color=red / br/!--网页中的换行-- img src=1.gif / /body /html 2.2 body标记 body标记使用方法示例，在记事本中键入以下代码，并更改扩展名为.html 或.htm html head title文档的标题/title /head body bgcolor=yellow background=47.jpg nbsp;nbsp;nbsp;nbsp;这里是文档的主体部分 /body html 2.3 body中常用子标记 示例： 2.3 body中常用子标记 思考： 1）如何将图片做成超链接形式？ 2）如何在需要位置换行？ 3）如何将文字、图片等元素在浏览器中居中？ 3. HTML中编写表格—重点掌握 练习 完成一个三行三列的表格，单元格文本如图所示 3. HTML中编写表格—重点掌握 3. HTML中编写表格—重点掌握 思考： 1）如何修饰表格单元格文本的颜色，文本字号？ 2）如何在单元格中插入图片？ 示例：相对路径练习 网站的文件目录结构如下， 要求在01.html中分别引用go1, go2, go3这三个图片 img src=../image1/go1.jpg img src=image2/go2.jpg img src=go3.jpg image1 front admin Image2 D1 go3.jpg go2.jpg go1.jpg 01.html 02.html * * * * 在01.html这个例子上讲解这页PPT （1）三种标记形式 （2）body后面的属性bgcolor的值可以用双引号，也可以使用单引号，甚至可以不写，但是尽量写双引号或单引号 （3）标记不区分大小写，把body写成BODY 或者boDY都可以，客户端的浏览器都可以解析 * 在01.html这个例子上讲解这页PPT （1）三种标记形式 （2）body后面的属性bgcolor的值可以用双引号，也可以使用单引号，甚至可以不写，但是尽量写双引号或单引号 （3）标记不区分大小写，把body写成BODY 或者boDY都可以，客户端的浏览器都可以解析 * * * * * 以上就是HTML文档的基本结构，现在分块来讲，每一块都深入的讲一些。 先说头部的涉及到的常用标记。 style/style用于美化网页，更好的展示网页内容（下学期的网页程序设计课程会专门讲） * 这些颜色不用记，我们只是介绍给大家，培养的不是网页设计师，不会设置颜色也无所谓 颜色可以使用颜色吸取器进行拾取，或者使用专业的网页IDE，如DreamWeavor * * 标题字类似我们word中的一级标题、二级标题 请确保将 HTML heading 标签只用于标题。不要仅仅是为了产生粗体或大号的文本而使用标题。 有哪些信誉好的足球投注网站引擎使用标题为您的网页的结构和内容编制索引。 因为用户可以通过标题来快速浏览您的网页，所以用标题来呈现文档结构是很重要的。 应该将 h1 用作主标题（最重要的），其后是 h2（次重要的），再其次是 h3，以此类推。 * Font的size最大设置到7，想设置更大的，必须借助CSS * Href: hyper refference 超链接 * * * * Href: hyper refference 超链接 anchor * 讲到这里，可能会时间不够 将路径问题这一部分放到《chapter1-JSP简介》中去讲，那一节课时间充裕 讲解的办法： （1）找到一个图片A和建一个网页文件B，不断移动A的位置，演示在B中如何插入。 （2）讲完之后让学生做练习 horizontal * 标题字类似我们word中的一级标题、二级标题 从这里开始，结合综合案例一进行讲解（对于每个知识可以先用演示案例演示一下知识点是如何