导图社区吉林大学《互联网数据库程序设计》6.1-6.4HTML设计

吉林大学《互联网数据库程序设计》6.1-6.4HTML设计

吉林大学《互联网数据库程序设计》6.1-6.4HTML设计。超文本标记语言，Dreamweaver，建立站点，管理站点，设计网页的步骤，HTML基本术语，文档设计工具

编辑于2023-04-06 16:41:21 吉林

html

Ray的思维导图

他的近期作品查看更多>>

《互联网数据库程序设计》10动态网页及程序设计
《互联网数据库程序设计》10动态网页及程序设计。链接数据库服务器，链接数据库服务器的通知语句，发送SQL语句的向导，输出记录集中的数据与记录集相关的数据
《互联网数据库程序设计》8.5-8.8数值与逻辑表达式
《互联网数据库程序设计》8.5-8.8数值与逻辑表达式，数值表达式，数值运算符，常用数值函数，逻辑表达式，时间戳
《互联网数据库程序设计》8.1-8.5PHP与表达式
《互联网数据库程序设计》8.1-8.5PHP与表达式，常用PHP编辑器，Dreamweaver开发PHP应用程序，PHP程序语法，PHP与HTML的区别，变量及其赋值运算与表达式输出，字符串表达式，字符串连接符

吉林大学《互联网数据库程序设计》6.1-6.4HTML设计

社区模板帮助中心，点此进入>>

Ray的思维导图

他的近期作品查看更多>>

相似推荐
大纲

互联网9大思维
- 29.6k
- 2.2k
- 340
MindMaster
组织架构-单商户商城webAPP 思维导图。
- 13.5k
- 176
- 15
Kacyun
域控上线
- 1.4k
- 10
- 5
jackrao
python思维导图
- 5.0k
- 229
- 8
(*^▽^*)
css
- 1.1k
- 41
- 5
A张舫
CSS
- 3.1k
- 187
- 33
journey
计算机操作系统思维导图
- 3.8k
- 195
- 22
journey
计算机组成原理
- 1.4k
- 70
- 10
journey
IMX6UL(A7)
- 460
- 5
- 1
Handler XU
考试学情分析系统
- 598
- 10
- 1
蒋龙

6.1-6.4HTML设计

超文本标记语言

HTML(HyperText Markup Language)，用于描述超文本内容及显示方式的标记语言

例

6.1.2Dreamweaver系统环境配置

单击编辑菜单→首选参数选项

6.2.1站点的基础知识

1 站点的概念

用于存储网站开发阶段的文件夹（目录）及其相关资源文件。文件夹由主目录和若干个子目录构成，每个目录用于存储网页（HTML）、程序脚本（PHP）、图像和样式（CSS）等网站的资源文件

2 文件夹类型

本地文件夹

本地计算机任意位置的文件夹，存储分类文件夹、网页、程序脚本及其相关的资源文件。仅设计静态网页，只需本地文件夹

远程文件夹

位于Web服务器上，若设计动态网页，发布前需设置服务器文件夹。远程文件夹通常与本地文件夹同名，且具有相同的目录结构，便于文件上传

6.2.2建立本地站点

建站点文件夹

按文件类型及功能建(子)文件夹，用英文或拼音命名

步骤

单击站点菜单→新建站点选项

单击服务器→ +按钮→ 基本选项卡

单击高级选项卡

选中远程与测试并保存

6.2.3管理站点

1 选择当前站点

在文件面板中，单击选择站点名

2 编辑站点

单击站点菜单→管理站点选项→站点名→编辑按钮

3 复制站点

在管理站点对话框中，单击站点名→复制按钮。目标站点与源站点同文件夹

单机复制按钮

4 删除站点

在管理站点对话框中选择点名，单击删除按钮。保留对应的文件(夹)

6.3.1工作界面

文档窗口

编写代码，查看网页效果

代码

用于编辑 HTML、PHP等代码等

拆分

左侧窗格设计代码，右窗格可视化设计

设计

以可视化页面编辑和显示页面，即所见即所得

属性面板

查看和编辑选定元素常用属性

状态栏

显示该文档相关信息

浮动面板组

功能面板，以小窗口的方式显示；鼠标拖动可以改变位置

6.3.2设计网页的一般步骤

1 新建网页

单击程序→所有程序→Adobe DreamweaverCS5

2 编辑和保存网页

在文档编辑区输入“欢迎访问人才招聘网！”

单击文件菜单→保存

3 预览网页

按F12键或者单击文件→在浏览器中预览→IExplore

6.4.1HTML基本术语

1. HTML标签

HTML文档中有特定意义的符号。括在<和>中

配对标签

由起始标签和结束标签成对使用

开始标签为<标签名称>

结束标签为</标签名称>

单标签

只有起始标签，不包含任何内容

单标签为<标签名称/>、 </标签名称>或<标签名称>

2. HTML元素

用于指示浏览器如何组织和显示HTML文档,一般由一个起始标签和对应的结束标签以及标签之间的元素内容构成

元素和标签区别

是否包含要表现的内容

3. HTML属性

语法

<标签名称属性名1="属性值1" 属性名2="属性值2"……>

属性包括属性名和属性值，必须在元素的起始标签中规定

同一元素的多个属性不分前后顺序，用空格隔开，属性值最好用半角双引号引起来。属性与值之间可用“:”或“=”

6.4.2HTML文档的设计工具及规则

1.用记事本编写HTML文档

用编辑器新建HTML文件，编写HTML代码，保存文件后，才能浏览网页

新建一个记事本文件，输入代码，单击文件菜单→保存选项，在保存类型中选择所有文件，文件名Onepage.HTML

2. 设计HTML文档

单击Dreamweaver文件菜单→新建选项，弹出新建文档对话框

切换到代码视图，将<Title>标签和</Title>标签之间的文字“无标题文档”修改为“我的第一个网页”，在<Body>标签和</Body>标签之间输入“Hello,HTML!”

单击文件菜单→保存选项，按F12键在浏览器中查看网页

新建HTML文档后，系统自动产生若干行代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transiti onal.dtd">

用于声明文档类型，必须写在HTML文档第一行，位于<Html>标签之前。若没有<!DOCTYPE>，浏览器按默认文档类型解析网页，各种浏览器可能有不同的浏览效果

说明整个网页标签应该符合XHTML规范

<meta

http-equiv="Content-Type"

表示描述文档类型

content=

content="text/html"表示浏览器要解析HTML 文档

charset=utf-8"

表示文档内容采用utf-8字符编码，中文网页通常采用GB2312或utf-8编码。

3. HTML的书写规范

HTML文件的列宽不受限制，多个标签可写成一行，甚至整个文件可写成一行

标签中的一个单词不能分两行写

尖括号、标签和属性项等必须使用半角的西文字符，不能使用全角字符

6.4.3 HTML文档基本结构

最基本的HTML文档包括四对标签

Html

Head

Title

Body

6.4.4 <Body>页面主体标签

1. Bgcolor：定义网页背景色

属性值可以是颜色名称，或#RRGGBB格式，六位十六进制值

HTML方法

<Html> <Head><Meta CharSet="utf-8" /> <Title>网页背景颜色</Title></Head> <Body Bgcolor="#cccccc" > 欢迎访问人才招聘网！ </Body></Html>

DW设计方法

在代码或拆分视图中，光标焦点在<Body>和/Body>内，单击页面属性按钮

2. Background定义网页背景图像

格式

<Body Background=图像文件及路径>路径可绝对路径和相对路径。

3. Text定义文字颜色