整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

html5如何将表单数据提交到数据库表的指定空格

.最普通最常用最一般的方法就是用submit type..

2.还有一种常用的方法是使用图片代码:

3.使用链接来提交表单,用到了javascript的DOM模型:

4.这种方法实际上是调用了一个javascript函数,使用javacript函数来提交表单,方法就非常多非常灵活了,比如可以把它加入到任意一个标签的onclick事件中:

5.比如一个表单里的提交按钮所指向的处理页面不同,这样由于表单在定义的时候就已经确定下表单数据的处理页面,所以单纯地在表单里放多个提交按钮是没有办法达到目的的。这就需要javascript。 首先得定义一个函数:

6.通过javascript改变form的action属性值,这样就可以实现多提交按钮而且功能不同了,页面内代码如下面的:

【IT科技之家-itkeji综合 -文章版权声明】

非特殊说明,本文版权归 [ IT科技之家-itkeji综合 ] 所有,转载请注明出处.

更多文章请关注:itkeji综合

TML常用标签

1. web标准

1.1 web标准的构成

主要包括 结构表现行为 三个方面。

标准说明结构用于对 网页元素 进行整理和分类(HTML)表现用于设置网页元素的 外观样式 (CSS)行为网页模型的定义及 交互 的编写(JavaScript)

如果将web标准比喻为一只鸟,则

  • 结构=身体
  • 表现=羽毛
  • 行为=动作(飞行、站立等)

1.2 标签关系

双标签关系分为:

  • 包含关系(父子)
  • 并列关系(兄弟)

(1)包含关系

<!--head标签包含title标签-->
<head>
    <title></title>
</head>

(2)并列关系

<!--head标签与body标签并列-->
<head></head>
<body></body>

2. HTML基本结构

标签名定义<html></html>html标签<head></head>文档的头部<title></title>文档的标题<body></body>文档的主体

<!DOCTYPE html>   <!--文档类型声明标签-->  
<html lang="en">    <!--en:英语,zh-CN:中文-->
    
    <head>
        <!--字符集,UTF-8为万国码,统一使用-->
        <meta charset="UTF-8">
        <title></title>
    </head>
    
    <body>
        
    </body>
    
</html>

3. HTML常用标签

3.1 标题标签

一个标题独占一行。(块级元素)

<h1>
    一级标题(字号最大)
</h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6>
    六级标题(字号最小)
</h6>

3.2 段落标签

用于将HTML文档分割为若干段落。

特点:

  • 文本在一个段落中会根据浏览器窗口的大小自动换行
  • 段落之间有空隙
<p>
    这是一个段落
</p>

3.3 换行标签

用于强制换行。

特点:

  • 单标签
  • 换行没有像段落那样的空隙
<br>这是换行标签

3.4 文本格式化标签

语义标签加粗<strong></strong>倾斜<em></em>删除线<del></del>下划线<ins></ins>

3.5 盒子标签

用于界面布局。

特点:

  • div一行只能放一个(块级元素)
  • span一行可以放多个(行级元素)
<div>
    这是大盒子
</div>
<span>这是小盒子</span>

3.6 图像标签和路径

(1)图像标签

用于定义页面中的图像。

<!--属性与属性之间用空格分开-->
<img src="图像的url" alt="" title="">

属性说明src图片路径( 必须属性 )alt图像不能显示时的替换文本title鼠标放到图像上显示的提示文本width设置图像的宽度height设置图像的高度border设置图像的边框粗细(在CSS中修改)

注:图像的宽和高一般只修改其中一个,另一个会随之调整。

(2)路径

  • 相对路径:文件相对于HTML页面的位置

相对路径分类符号说明同一级src="文件名"下一级/src="同一级文件夹名称/文件名"上一级../src="../文件名"

  • 绝对路径:完整的路径名称(一般很少用)。eg. C:\xxx\xxxx.jpg

注意:绝对路径用“\”分隔,相对路径用“/”分隔。

3.7 超链接标签和链接分类

(1)超链接标签

<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>

属性作用href链接目标的url( 必须属性 )target链接页面的打方式。_self:在当前窗口打开(默认值),_blank:在新窗口打开

(2)链接分类

  1. 外部链接:例如http://www.bilibili.com
  2. 内部链接:网站内部页面之间的相互链接,例如index.html
  3. 空链接:#
  4. 下载链接:地址里是一个文件或压缩包
  5. 网页元素链接:在网页中的各种网页元素都可以添加超链接
  6. 锚点链接:可以快速定位到页面中的某个位置链接:<a href="#名字"></a>找到目标位置标签,里面添加一个id属性,<h2 id="名字"></h2>返回顶部:<a href="#"></a>

3.8 注释和特殊字符

(1)注释

<!--这是一行注释-->

(2)特殊字符

特殊字符描述字符的代码空格符<小于号<>大于号>&和号&¥人民币¥©版权©®注册商标®°摄氏度°±正负号±✖乘号×➗除号÷²平方²³立方³

注:重点记住前三个。

大家平时学习web前端的时候肯定会遇到很多问题,小编我为大家准备了web前端学习资料,将这些免费分享给大家!如果想要的可以找我领取

领取方式:

如果想获取这些学习资料,先关注我然后私信小编“01”即可免费领取!(私信方法:点击我头像进我主页右上面有个私信按钮)

如果这篇文章对你有帮助,请记得给我来个评论+转发噢

TML是超文本标记语言。

web标准是由W3C和其它标准化组织制成集合。

web标准的构成

结构(对网页元素进行整理和分类-HTML)

表现(设置网页元素的版式,颜色,大小等外观样式-CSS)

行为(模型的定义及交互的表现-JS)

HTML常用标签

加粗:<strong>和<b>

倾斜:<em>和<i>

删除线:<del>和<s>

下划线:<ins>和<u>

<div>分割分区<span>跨度跨距

图片标签<img/>

属性: src图片路径

alt替换文本,图片无法正常显示

title提示文本,鼠标放到图像显示

width宽度,height高度(只需要修改其中一个)

border边框(无需单位直接写数值)

注意:

①图像标签可以拥有多个属性,必须写在标签名后面

②属性之前不分先后顺序,标签名与属性,属性与属性之间需要空格分开

③属性采取键值对的格式

相对路径:以引用文件所在位置为参考基础

(同一级路径,下一级路径/,上一级路径../)

绝对路径:从盘符开始的路径(\)

常用属性

img ——vspace垂直边距 ,hspace水平边距 align对齐

details,summary,鼠标点击时显示或隐藏

mark 文本中高亮显示,和strong相似

cite 用于引用标记,斜体显示

draggable true选中后可以拖动操作

font定义 font-style font-weight font-size/line-height font-family 顺序不能改变

word-wrap break-word长单词或url地址自动换行

letter-spacing字间距

word-spacing单词间距

line-height行间距

text-decorantion文本装饰unline下划线,overline上划线,line-through删除线

text-indent 2em 首行缩进两个字符

white-space空白符处理 pre

box-sizing:content-box当widthh和height的时候不包括margin和panding

更换图层位置,z轴偏移z-index:-10

align-items:center居中对齐

align-self:center


超链接标签<a>

href链接目标地址

target链接页面打开的方式(_self当前窗口打开,_blank新窗口中打开方式)

外部链接,内部链接,空链接,下载链接,网页元素链接,锚点链接(快速定位到页面的某个位置- 添加id属性)

去除超链接样式:text-decoration:none


特殊字符

空格符 &nbsp;

小于号&lt; 大于号&gt;


表格标签

align对齐方式

bolder表格边框

cellpadding单元格与内容之间空白

cellspacing单元格与单元格之前空白

合并单元格:rowspan colspan


列表标签

无序列表:ul li

有序列表:ol li

自定义列表:dl dt dd


表单标签

完整表单:表单域<form>,表单控件,提示信息

<form>

——action(指定接受并处理表单数据的服务器程序的url地址)

——method(get/post设置表单数据的提交方式)

——name(指定表单名称)


<input>输入元素

type属性:button(点击按钮)checkbox(复选框)file(输入字段和“浏览”按钮)hidden(隐藏输入字段)image(图片形式提交按钮)password(密码字段)radio(单选按钮)reset(重置按钮)sumbit(提交按钮)text(单行输入字段,默认20个字符)

name属性:(相同的名字——单选框和复选框)区别不同表单元素

value属性:定义input元素值

checked属性:页面首次加载是否选中

maxlength属性:输入字段的最大值


<lable>标签

用于绑定一个表单元素,当点击<lable>标签内的文本时,浏览器会自动将焦点转到或者选择对应的表单元素上,用来增加用户体验。

<lable>标签的for属性与相关元素的id属性相同

<select>下拉列表元素

-<option>

-selected="selected"默认选中

<textarea>文本域

-cols rows (每行每列字数)