dreamweaver,输入框

时间:2021-10-29 04:20:12 初二作文

篇一:《dreamweaver制作文本框行为》

dreamweaver制作文本框行为 我们在各种网页上见到过这种文本框,比如下面这个登陆界面,里面有提示“请输入用户名”,当光标放到上面的时候,它将提示删除,这就是一个文本框行为,其实制作这样的文本框行为很简单,下面就是具体的方法喽: 工具/原料

 dreamweaver cs5 方法/步骤 1. 1 打开dreamweaver以后,在插入选项中,插入一个表单,点击图示的位置,我们先来建立一个有文本域的表单

2. 将光标放到表单里,在菜单栏上,插入一个标签,如图所示,点击标签按钮。接着在标签中输入汉字“用户名”

3.

4. 接着,插入一个文本域,点击图示中的按钮 弹出一个设置对话框,这里需要填写id,因为会要用到对该id的文本域的行为,需要有id才可以

5.

6. 同样的方法我们在建立一个密码的文本框,设置他们都为右对齐 打开代码视图,将文本域标签中,添加一段代码value=“请输入用户名”,这个作为文本域的默认文字

7.

8. 我们看到这里已经出现了默认文字,怎么样让光标放到文本域的时候让这些文字消失呢? 选中该文本域,打开行为窗口,点击添加按钮,添加一个行为,如图所示:

9. 依次执行:设置文本--设置文本域文字,打开设置对话框

10.在打开的对话框中,什么都不要输入,点击确定按钮即可。

篇二:《Dreamweaver表单》

表单

HTML表单(Form )是HTML的一个重要部分 ,主要用于采集和提交用户输入的信息。 举个简单的例子 ,一个让用户输入姓名的HTML表单 (Form)。示例代码如下:

<form action="method="get">

请输入你的姓名:

<input type="text" name="yourname">

<input type="submit" value="提交">

</form>

学习HTML表单(Form)最关键要掌握的有三个要点:

表单控件(Form Controls)

Action

Method

先说表单控件(Form Controls),通过HTML表单的各种控件,用户可以输入文字信息,或者从选项中选择,以及做提交的操作。比如上面的例句里,input type= "text"就是一个表单控件,表示一个单行输入框,允许用户输入一些简短的单行信息。

用户填入表单的信息总是需要程序来进行处理,表单里的action就指明了处理表单信息的文件。比如上面例句里的

至于method,表示了发送表单信息的方式。method有两个值:get和post。get的方式是将表单控件的name/value信息经过编码之后,通过URL发送(你可以在地址栏里看到)。

而post则将表单的内容通过http发送,你在地址栏看不到表单的提交信息。那什么时候用get,什么时候用post呢?一般是这样来判断的,如果只是为取得和显示数据,用get;一旦涉及数据的保存和更新,那么建议用post。

表单(Form)常用控件有:

input type="text" 单行文本输入框

input type="submit" 将表单(Form)里的信息提交给表单里action所指向的文件

input type="checkbox" 复选框

input type="radio" 单选框

select 下拉框

textArea 多行文本输入框

input type="password" 密码输入框(输入的文字用*表示)

下面具体讲解:

a. 单行文本输入框(input type="text")

比如用户姓名。例句如下:

<input type="text" name="yourname">

b. 复选框(input type="checkbox")

复选框允许用户在一组选项里,选择多个。示例代码:

您的爱好请选择:

<input type="checkbox" name="eat" value =" eat ">吃饭<br>

<input type="checkbox" name="sleep" value =" sleep ">睡觉<br>

<input type="checkbox" name="hurt" value =" hurt ">打豆豆<br>

其中用checked表示缺省已选的选项,例如让桔子事先被选中:

<input type="checkbox" name="sleep" value ="sleep" checked>吃饭<br>

C.单选框(input type="radio")

使用单选框,让用户在一组选项里只能选择一个。示例代码:

<input type="radio" name="fruit" value = "Apple">苹果<br>

<input type="radio" name="fruit" value = "Orange">桔子<br>

<input type="radio" name="fruit" value = "Mango">芒果<br>

用checked表示缺省已选的选项。

<input type="radio" name="fruit" value = "Orange" checked>桔子<br>

d. 下拉框(select)

下拉框(Select)既可以用做单选,也可以用做复选。单选例句如下:

<select name="fruit" >

<option value="apple">苹果

<option value="orange">桔子

<option value="mango">芒果

</select>

如果要变成复选,加muiltiple即可。用户用Ctrl来实现多选。例句:

<select name="fruit" multiple>

用户还可以用size属性来改变下拉框(Select)的大小。例句:

<select name="fruit" size=“6”>

e.多行输入框(textarea)

多行输入框(textarea)主要用于输入较长的文本信息。例句如下:

<textarea name="yoursuggest" cols ="50" rows = "3"></textarea>

其中cols表示textarea的宽度,rows表示textarea的高度。

f. 密码输入框(input type="password")

密码输入框(input type="password")主要用于一些保密信息的输入.例句如下:

<input type="password" name="yourpw">

g. 提交(input type=submit)

通过提交(input type=submit)可以将表单(Form)里的信息提交给表单里action所指向的文件。例句如下:

<input type="submit" value="提交信息">

h. 图片提交(input type=image)

input type=image 相当于 input type=submit,不同的是,input type=image 以一个图片作为表单的提交按钮,其中 src 属性表示图片的路径。

<input type="image" src ="alt = "提交" NAME="imgsubmit">

i.隐藏域(input type=hidden)

隐藏域,主要是实现隐藏传值,例句如下:

<input type=hidden name=“adminid”value=123>

篇三:《Dreamweaver网页制作教程》

Dreamweaver网页制作教程:定义站点

网页教学网 【转载】

Web 站点是一组具有如相关主题、类似的设计、链接文档和资源。Dreamweaver MX 2004 是一个站点创建和管理工具,因此使用它不仅可以创建单独的文档,还可以创建完整的 Web 站点。创建 Web 站点的第一步是规划。为了达到最佳效果,在创建任何 Web 站点页面之前,应对站点的结构进行设计和规划。决定要创建多少页,每页上显示什么内容,页面布局的外观以及页是如何互相连接起来的。 请执行以下操作:

启动 Dreamweaver MX 2004:

选择“站点”>“管理站点”(即,从“站点”菜单选择“管理站点”)。 出现“管理站点”对话框。

在“管理站点”对话框中,单击“新建”,然后从弹出式菜单中选择“站点”。 出现“站点定义”对话框。

如果对话框显示的是“高级”选项卡,则单击“基本”。 出现“站点定义向导”的第一个界面,要求您为站点输入一个名称。

在文本框中,输入一个名称以在 Dreamweaver MX 2004中标识该站点。该名称可以是任何所需的名称。

单击“下一步”。出现向导的下一个界面,询问您是否要使用服务器技术。{dreamweaver,输入框}.

选择“否”选项,指示目前该站点是一个静态站点,没有动态页。 单击“下一步”。出现向导的下一个界面,询问您要如何使用您的文件。

选择标有“编辑我的计算机上的本地副本,完成后再上传到服务

器(推荐)”的选项。 在站点开发过程中有多种处理文件的方式,初学网页制作的朋友请选择此选项。

单击该文本框旁边的文件夹图标。 随即会出现“选择站点的本地根文件夹”对话框。

单击“下一步”, 出现向导的下一个界面,询问您如何连接到远程服务器。从弹出式菜单中选择“无”。 您可以稍后设置有关远程站点的信息。目前,本地站点信息对于开始创建网页已经足够了。单击“下一步”,该向导的下一个屏幕将出现,其中显示您的设置概要。

单击“完成”完成设置。 随即出现“管理站点”对话框,显示您的新站点。单击“完成”关闭“管理站点”对话框。

现在,已经为您的站点定义了一个本地根文件夹。下一步,可以

编辑自己的网页了。

Dreamweaver网页制作教程:页面制作

网页教学网 【转载】

现在,以下边的简单网页为例,叙述一下制作过程。简单网页如下图:{dreamweaver,输入框}.

在开始制作之前,我们先对这个页面进行一下分析。看看这个页面用到了那些东西。

□网页顶端的标题“我的主页”是一段文字。

□网页中间是一幅图片。

□最下端的欢迎词是一段文字。

□网页背景是一深紫红颜色。

知道了这个网页的结构以后我们就来可以制作了。

首先启动Dreamweaver MX 2004,确保你已经用站点管理器建立好了一个网站(根目录)。

为了制作方便,请您事先打开资源管理器,把要使用的图片收集到网站目录images文件夹内。

【插入标题文字】

进入页面编辑设计视图状态。在一般情况下,编辑器默认左对齐,光标在左上角闪烁,光标位置就是插入点的位置。如果要想让文字居中插入,点属性面板居中按钮即可。启动中文输入法输入“我的主页”四个字。字小不要紧,我们可以对它进行设置。

【设置文字的格式】 选中文字,在上图属性面板中将字体格式设置成默认字体,大小可任意更改字号。并选中“B”将字体变粗。

【设置文字的颜色】首先选中文字,在属性面板中,单击颜色选择图标,在弹出的颜色选择器中用滴管选取颜色即可。

【设置网页的标题和背景颜色】

篇四:《Dreamweaver技巧大全》

Dreamweaver超级技巧

1. 制作背景音乐

在Dreamweaver中插入背景音乐是非常容易实现的,这里介绍两种方法,由大家选择。

(1)在页面不显眼的地方插入一空层 ,并在层内放入一个ActivX对象 ,双击该对象,在打开的对话框中选择一个MIDI音乐文件,然后在层对象属性面板中设定其可视性为“Hidden”,保存变动后按F12预览网页,听听是否有音乐声。

(2)另一种方法是利用Dreamweaver的“Behaviors”行为编辑器 ,单击“+”按钮,选择其中“Play Sound”选项,在弹出的对话框中选择一个音乐文件即可。自己动手试一试吧!

2. 让背景图不滚动

与FrontPage不同,Dreamweaver中插入的背景图是会随文字滚动的。有的时候我们需要制作固定的背景图,怎么办呢?先定义一张背景图,按“F10”打开HTML源文件,找到定义背景图片的语句,例如background=″images/background.JPG″,在它的后面空一格加上一句bgproperties=″fixed″。预览一下,是不是有点小小的成就感。

3. 定义大小不变的文字

为什么别人网页上的文字那么漂亮,不管你怎么按浏览器字体按钮上的大小,他们的字体尺寸都不会发生变化。其实他们使用了网页中的“CSS”样式表技术,在Dreamweaver中要实现这一功能是非常简单的。首先按“F7”或者选择“窗口”菜单中的“样式表”选项打开样式表编辑器,在窗口中单击鼠标右键选择“新建”,在弹出的对话框中输入需要定义的样式表名称,按“确定”,然后在列表中选择第一项“类型”,并给具体的文字属性定义参数(一般来说文字的大小在800×600的屏幕中选择10.5较为适宜),按“确定”后,定义好的样式表就出现了。选择网页编辑窗中的文本,单击新的样式表名,可以看到选中的文本发生的变化。预览一下,试试定义的文本字体尺寸还会不会随浏览器的选择字体大小而改变。

4. 插入Flash动画

Macromedia公司的Flash动画因其具有交互性、传送速度快等特点,已逐渐成为网页制作的一项新武器,如果你的网页上能插入一段Flash动画,那么一定会使你的作品增色不少。在Dreamweaver中插入Flash制作的SWF格式动画十分容易,单击对象工具栏上的Flash徽标或单击的“媒体”下的“Flash”,就可以打开选择SWF动画文件的对话框了,选好文件后可在其属性面板中设定播放的参数,即大功告成。

5. 让表格给网页留白

在Dreamweaver的新网页上输入文字时,默认格式是顶天立地的,十分不美观。要避免这一缺憾其实很简单,只要大家用好表格工具就行了。具体做法是:在新页面上插入一张居中对齐的表格,为了能够使表格方便控制,最好设定奇数列,并且数值不要太大。这样在单元格内输入的文字就被限制在一个可以随意调整宽度的区域内,就不愁文字不听使唤了

6. 改变状态栏提示文字

一般情况下,当浏览器装入一个页面时,在其状态栏上显示的是该页面的地址名称,十分呆板。你有没有想过给浏览器的状态栏增加一点个性呢?如果有的话,那么请按照以下的步骤,定制自己喜欢的文字吧!首先打开“Behaviors”行为编辑窗,单击“+”按钮,选择“Set Text Set”下的“Text Of Status Bar”选项,然后在方框中输入自己的文字,例如“欢迎来到我的主页”等,单击“确定”即可

7. 整合的文本代码编辑器

可视化网页编辑软件的最大不便之处就是很难对源代码进行编辑,更别说JavaScript了;不过

Dreamweaver?将使你处理代码变得异常轻松。这个内建的文本代码编辑器主要的新功能是:自动缩排(可以一次选取多行进行缩排),?还可以进行符号的检测,如果在编写代码忘了一个“”,它将给出提示。在工具表中的下拉菜单会列出当前网页中所有自定义JavaScript函数,可让你在网页原代码中自由跳转,“原始码导航工具”可以让专业人士方便地处理JavaScript函数,在文本代码编辑器中输入JavaScript代码,系统将用不同的颜色来显示。

8. 在Dreamweaver中输入多个空格

我们平时输入的空格是半角字符,在Dreamweaver中只能输入一个,要想输入多个空格只要输入全角空格就可以了。输入全角空格的方法是:打开中文输入法,按Shift+Space切换到全角状态。这时你输入的空格就是全角空格了

9. 解决Dreamweaver的BUG之一

在Dreamweaver 3.0中行为面板(Behavior inspector)中,“Events for”下拉菜单项无法打开。这样一来,很多特技效果形同虚设,根本没法制作。其实这应该算Dreamweaver 3.0和中文Windows98不兼容的一个地方吧,在英文Windows98中就没有这个问题。而实际上这个菜单还是可以打开的,只不过是不能正确显示罢了。在选中下拉菜单后,我们可以用上下键来选择我们想要用的浏览器。

10. 用Dreamweaver 3.0的模版制作网页,设置行为(Behavior)