Dreamweaver8下定义WEB功能页面介绍

简介:

说到dreamweaver8,相信大家都比我熟悉,也许有人说dreamweaver8是一个开发工具,那开发工具多了,我自己是这么认为的,dreamweaver8是专业的网页开发工具;由于自己是做运维的,所以在开发的角度我算是一个绝对的菜鸟,可以说是一窍不通,之前就没做过开发先关的东西,现在才开始慢慢接触,所以每天晚上回家看看java、html、jsp相关的文档学习,同时,我们大家都知道一般正常的页面程序文件通过新建超级文本文件来修改扩展名来定义文本格式,默认的超级文本文件格式化的扩展名是.txt,我们将txt修改成html就成了一个简单的web文件了,扩展名有很多,根据自己的需求来修改扩展名。其实大家都很了解,web程序下还有一个.jsp的文件。也是一个java下的web程序应用,其实有很多,在这就不多介绍了。相信大家比我熟悉。

昨晚上兴致一来就想通过dreamweaver8实现第一个自己的web程序。该程序我准备用来注册用户相关的信息,所以就定制了一个自己的需求页面,所以在此分享一下。

首先是下载dreamweaver8程序,然后就是安装了。再次就不多说了,

接下来我们就通过dreamweaver8创建一个html文件来定义自己的页面,定以前,我们首先理解一下dreamweaver8的功能使用。首先通过dreamweaver8创建一个网页

image

创建完成,接下来我们对以下内容进行简单分析:

image

我们保存一下,发现新建了一个扩展名为html的超级文本文件:

image

我们知道在html内注释需要用<!-->符号定义:

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

大家都知道,html文件内容必需是以<html> </html>开始结束的。

image

接下来,我们要定义一个标题:所以需要应用到

1
< head ></ head >

然后在此域内定义显示的标题<tatle></tatle>即可

image

接下来就是定义显示内容:

将显示的内容定义到<body></body>内即可

image

接下来我们开始编辑显示及属性了

image

保存后我们开始预览效果。

image

页面出来了,日常我们修改字体大小及颜色呢:

image

那就是需要用户属性了:size、color了,那提前需要将修改的内容用<font></font>扩起来

image

我们在<font></font>内添加相应的功能即可

image

修改后,我们再次预览效果。

image

接下来,我们定义一个列表文件,列表文件一般都是树状结构。通过相应的代码会自动缩进

比如我们定义一个名称为:开发项目,下又分java,html,jsp

列表文件表示为<dl></dl>

1
2
< dt ></ dt >
< dd ></ dd >

编码定义:

1
2
3
4
5
6
7
< dl >
< dt >开发项目</ dt >
< dd >html</ dd >
< dd >java</ dd >
< dd >jsp</ dd >
< dd >c++</ dd >
</ dl >

image

image

1
2
< ol ></ ol >数字标签
< ul ></ ul >符号标签

image

预览效果:

image

1
< hr  /> 定义水平线:

image

定义水平线属性:线的粗细、颜色

image

预览效果

image

然后,我们给该页面添加一个图片,那应该怎么做呢

image

1
< img  src=”” alt> 定义图片

image

image

调整图片大小:

1
htight=”300”width="200" >

image

image

接下来我们就是 表格了;

注:<table></table>定义一个表格

<tr></tr>定义一行

<td></td>定义一列

1
2
3
4
5
6
< table  border = "1" >
< tr >
< td >表格一</ td >
< td >表格二</ td >
</ tr >
</ table >

image

为了更好的体现该功能,添加表格颜色

1
< table  border = "1"  bordercolor = "#FF3366" >

image

添加背景颜色

1
< table  border = "1"  bordercolor = "#FF3366"  bgcolor = "#FFFF33" >

image

调整表格的分辨率及显示格式

1
< table  border = "1"  bordercolor = "#FF3366"  bgcolor = "#FFFF33"  cellpadding = "4"  ;70%"  cellspacing = "10" >

image

接下来我们定义超链接

<a href="www.baidu.com">百度

image

image

超链接定义完后,我们在页面打开该超链接会通过当前页面打开,那如果我们正常打开超链接是希望在新的页面打开超链接的,所以我们为了解决这个问题需要在超链接下添加新建链接

1
target="_blank"

image

image

我们进行测试:我们发现打开百度是在不同的页面下跳转打开的

image  

接下来我们再次为超链接定义功能,单击图形进行超链接打开操作

我们先下载一个图片:然后定义一个超链接:

1
< a  href = "www.baidu.com" > < img  src = "download.gif"  />

image

然后图片比较大,所以我们需要定义图片大小:

1
< a  href = "www.baidu.com" > < img  src = "download.gif"  height = "30"  ;40" />

image

image

接下来定义邮件超链接:

1
< a  href = "mailto:gaowenlong@qq.com?subject=call us" />联系我们 < a />

image

添加迅雷下载超链接:

1
< a  href = "thunder://www.baidu.com" >上海滩抢先版

image

image

单击开始下载:

image

标记符号:

如果当前也面的内容较多,为了方便预览,通过标记符号来定义:

首先是标记最顶部,然后在最后编辑跳转到top即可。

1
< a  name = "top" >

image

预览效果:

image

页面的最后后:

1
<a href="#top"回到顶部

image

预览效果:

image



本文转自 高文龙 51CTO博客,原文链接:http://blog.51cto.com/gaowenlong/1549421,如需转载请自行联系原作者

相关文章
|
23天前
|
自然语言处理 Java 数据库连接
掌握JSP页面编程:动态生成Web内容
【4月更文挑战第3天】Java Server Pages (JSP) 是一种用于创建动态Web内容的Java技术,它结合HTML并允许在页面中嵌入Java代码。JSP支持代码片段、表达式语言(EL)和JSTL标签库,简化动态内容生成。当服务器接收到请求时,执行JSP中的Java代码并将结果嵌入HTML返回给客户端。示例展示了如何显示当前日期和时间。JSP可与Servlet、JavaBeans、数据库等结合,用于构建功能丰富的交互式Web应用。
掌握JSP页面编程:动态生成Web内容
|
29天前
|
JSON JavaScript 数据格式
jwt-auth插件实现了基于JWT(JSON Web Tokens)进行认证鉴权的功能。
jwt-auth插件实现了基于JWT(JSON Web Tokens)进行认证鉴权的功能。
44 1
|
1月前
|
机器学习/深度学习 人工智能 前端开发
机器学习PAI常见问题之web ui 项目启动后页面打不开如何解决
PAI(平台为智能,Platform for Artificial Intelligence)是阿里云提供的一个全面的人工智能开发平台,旨在为开发者提供机器学习、深度学习等人工智能技术的模型训练、优化和部署服务。以下是PAI平台使用中的一些常见问题及其答案汇总,帮助用户解决在使用过程中遇到的问题。
|
3月前
|
Web App开发 人工智能 前端开发
【Web API系列】使用getDisplayMedia来实现录屏功能
【Web API系列】使用getDisplayMedia来实现录屏功能
67 0
|
3月前
|
前端开发 开发者 UED
Web 应用中显示页面字体使用的 font-based icons 技术讲解
Web 应用中显示页面字体使用的 font-based icons 技术讲解
35 0
|
4月前
|
编解码 前端开发 JavaScript
摄像头web网页播放功能: ffmeg和nginx实现
摄像头web网页播放功能: ffmeg和nginx实现
|
1月前
|
设计模式 前端开发 Shell
Python生成Web页面Web框架
Python生成Web页面Web框架
16 0
|
5月前
|
消息中间件 数据安全/隐私保护 Windows
windows下RabbitMQ安装后,无法进入web管理页面问题
windows下RabbitMQ安装后,无法进入web管理页面问题
140 1
|
2月前
|
JavaScript 前端开发 API
「深入探究Web页面生命周期:DOMContentLoaded、load、beforeunload和unload事件」
在 Web 开发中,了解页面生命周期是非常重要的。页面生命周期定义了页面从加载到卸载的整个过程,包括各种事件和阶段。在本文中,我们将详细介绍四个关键事件:DOMContentLoaded、load、beforeunload 和 unload。我们将探讨这些事件的属性、API、应用场景,并提供一些代码示例和参考资料。
|
3月前
Flutter笔记:使用Flutter构建响应式PC客户端/Web页面-案例
Flutter笔记:使用Flutter构建响应式PC客户端/Web页面-案例
58 0